Форум пользователей Impera CMS
Impera CMS - отличный движок для лёгкого создания интернет магазина.
Обладает невероятным количеством функций, необходимых в онлайн торговле.

Улыбнитесь: CSS-битмапы и CSS3-видео

Следить
Главная
17:59
02 дек
#
Разработчик написал:

Пару месяцев назад на сайте HtmlBook.ru был проведён мини-конкурс "Хэллоуин", на который необходимо было представить художественное произведение на тему праздника, исполненное только с помощью html-разметки и css-правил, не задействуя фоновые картинки. Представленные на конкурс 20 работ, прямо сказать, порадовали. Все они относятся к отдельному направлению CSS-графики: построение задуманной картинки послойно размещёнными стандартными html-контейнерами (как правило тегами <div>), соответствующим образом стилизованными и спозиционированными в нужные места на экране-холсте.

Хочу показать примеры другого направления CSS-графики - imperacms.ru/examples/css-image/index.php - воспроизведение растра исходной картинки последовательно размещёнными стандартными html-контейнерами (как правило тегами <hr> для уменьшения размера генерируемой разметки) и стилизованными в размер 1х1 px плюс окрашенными в цвета пикселей, которым соответствует каждый контейнер. В простейшем случае это последовательное размещение одноточечных контейнеров линия за линией, в другом, более сложном случае - вычисление множества разноокрашенных и разноразмерных полигонов с послойным наложением и позиционированием до приближения к оригиналу.

По указанной выше ссылке демонстрируются такие примеры:

  • капча, отрисованная не картинкой, а HTML-CSS-разметкой;
  • картинка, загруженная из файла и преобразованная в HTML-CSS-разметку;
  • "видео" - это битмап на HTML-CSS-разметке и CSS3-анимации пикселей.

Написание ответа

Перед публикацией рекомендуется использовать Предпросмотр, чтобы увидеть конечный вид сообщения.


Обратите внимание! Для противодействия спаму новые посты форума проявляются с задержкой от нескольких минут, пока не пройдут модерацию.


Хостинг для сайта

Хостинг для интернет магазина

Svai.net

Украина
г. Черкассы
5+ Заказать

TutHost.ua

Украина
г. Киев
Заказать

Mirohost.net

Украина
г. Киев
? Заказать

HyperHosting.com.ua

Украина
г. Винница
i подробнее Заказать

Agava.ru

Россия
г. Москва
Заказать

Ukraine.com.ua

Украина
г. Киев
5 Заказать
Импераготовасотрудничатьс провайдерами Важно Учтите Этот список перечисляет лишь некоторых хостинг-провайдеров, у которых существуют специальные тарифные планы для интернет магазинов, а сам список не означает, что другие провайдеры чем-то хуже.

Существующие в списке оценки по 5-бальной шкале не должны учитываться при выборе, так как носят субъективный характер и касаются соотношения цена-качество-скорость только для самых дорогих тарифных планов.

Демо Главная Хронология Соглашение Материалы Контакты