Рубрика «html» - 148

в 8:41, , рубрики: css, css animations, css selectors, css transitions, html, media queries, performance, polyfills, sass, конференция, отчёт, метки: , , , , , , , , , ,

CSS Summit 2012, моя первая онлайн конференция

В начале августа удалось побывать на четвёртой, ежегодной онлайн конференции CSS Summit. Конференция проходила 3 дня подряд с разбитием докладов по следующим направлениям: CSS3 training, Advanced CSS, Preprocessors. Все доклады на английском языке.

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

Записи докладов как со всей конференции, так и за отдельные дни, можно купить на официальном сайте. Промо код, со скидкой 20% — “20SNOOK”.

Под катом пару слов об организации мероприятия, ссылки на презентации и небольшой конспект интересных тезисов и мыслей о веб разработке.
Читать полностью »

в 16:40, , рубрики: css, html

На днях столкнулся с задачей:

Сделать две одинаковые по высоте <div>-колонки, не зависимо от количества текста в какой либо из них.

Условия:

  1. Никаких таблиц;
  2. Поддержка IE6+ и т.д;
  3. Резиновая верстка;
  4. Никакого JavaScript, чистый HTML и CSS.

Дизайн:

В дизайне изображены две колонки с отступом друг от друга. Каждый из них имеет свой фон и border с округленными уголками. На вид все просто.

Поиск решений:

Искал и естественно нашел очень полезный пост, где описаны все самые действенные способы решения данной задачи: http://habrahabr.ru/post/64173/.
Собственно 4-е решение из этого поста было наиболее приемлемым, но с помощью него мне так и не удалось вывести два разных фона для своих колонок.

Решение

Читать полностью »

в 13:13, , рубрики: canvas, html, javascript, фракталы, метки: , ,

Сегодня я прочитал пост пользователя celen и вдохновился красотой T-фракталов. Так как я немного увлекаюсь созданием растровых композиций в JavaScript Canvas, то у меня возникла идея реализовать то же самое, только на стороне клиента силами JS, освобождая сервер от нагрузки.
Читать полностью »

в 6:24, , рубрики: css, html, styleguides, web-разработка, Веб-разработка

По мере того как мы подводим итоги недавнего опроса по сортировке CSS свойств у нас появляется более серьезные вопросы о стиле форматирования CSS. Сортировка свойств это всего лишь один шаг на вашем пути к завершенной стратегии форматирования стилей. Название класса — это часть стратегии. Распределение — часть стратегии. Комментарии, отступы, структура файла… все это формирует руководство по форматированию CSS.

Давайте рассмотрим существующие практики форматирования.Читать полностью »

в 14:42, , рубрики: css, css3, html, html5, Веб-разработка, сетки

Подавляющее большинство сайтов создано с использованием сеточных макетов. Они могут не использовать их в явном виде, но если на сайте присутствует блок с основным контентом, расположенный справа, и боковой блок (сайдбар), расположенный слева, то это и есть простейшая сетка.

Если требуется реализовать более сложные сетки, то люди прибегают к помощи фреймворков. Они считают, что сетки это сверх сложная вещь, которую лучше доверить настоящим знатокам CSS. Уверенность в этом укрепляется тем фактом, что большинство сеточных фреймворков, с которыми они имеют дело, являются очень сложными.

В этой статье я расскажу вам, как я верстаю сеточный макет. Это не так уж и сложно. И даже сделать резиновые сетки не составит большого труда.
Читать полностью »

в 18:44, , рубрики: css, html, рисование, метки: ,

На Хабре не раз публиковались статьи о «великом и могучем» CSS, с помощью которого рисовали Сердце ко дню Святого Валентина, новогоднее дерево.
Скоро заканчивается лето, а главным символом лета, на мой взгляд, является солнце.
Сегодня я хотел бы также внести лепту в тему «рисования» на CSS, поэтому предлагаю попытаться нарисовать солнце.
Читать полностью »

в 7:56, , рубрики: .net, css, html, jetbrains, JS, ReSharper, vb.net, winjs, WinRT, Блог компании JetBrains, Программирование, метки: , , , , , , ,

ReSharper7Две недели назад мы объявили о выходе ReSharper 7.0, лишь кратко перечислив те новинки, которые были реализованы в этом мажорном релизе.
Сегодня же подписчики MSDN и TechNet получат возможность скачать Visual Studio 2012, и это прекрасный повод, чтобы рассказать про новые возможности ReSharper 7.0 максимально подробно и обстоятельно.
Читать полностью »

в 22:36, , рубрики: canvas, html, html5, html5 canvas, images, javascript, Веб-разработка, метки: , , , ,

Здравствуйте.
Мне бы хотелось рассказать про мой «Bart Chalkboard Generator».image
Я уверен, что большинство из вас знают сериал «The Simpsons», и вы помните что почти в каждой новой заставке Барт писал на школьной доске что-то новое, типа: «They are laughing at me, not with me». А в интернете часто всплывает картинка с текстом: «I will use google before asking bump questions». И вот однажды я подумал, почему бы не создать простой генератор подобных картинок, да ещё и на Html5, что бы попрактиковаться?
Читать полностью »

в 19:01, , рубрики: Audio Data API, html, javascript, media queries, браузеры, медиаплеер

HTML5 аудио — состояние дел. Часть 2 (Статья специалиста по фронтенду и медиатегам Марка Боаса (Mark Boas) от 8 мая 2012. Перевод заключительной части. Начало дало понять, что придётся попотеть, прежде чем освоить всю кухню, а ведь это ещё развивается… Не ждите коротких рецептов.)

Содержание первой части:
■ Типы MIME
  ● Серверная часть
  ● Клиентская часть
■ Заранее узнать тип аудио поможет .canPlayType (наверное)
■ Текущая поддержка кодеков в браузерах
■ Форматы контейнеров и расширения файлов
■ Мы имеем тег <audio> и не боимся его использовать!
■ Буферизация, поиск и интервалы воспроизведения
  ● Атрибут buffered
  ● Объект TimeRanges
 &nbsp  ● Атрибуты seeking и seekable
Читать полностью »

в 11:59, , рубрики: css, CSS3 animation, Firefox, flame, html, браузеры, метки: , ,

Немного огня на чистом CSS (Firefox)Зайдя на домашнюю страницу браузера Firefox about:home (автономная, в самом браузере), обнаружил там неплохую реализацию пылающего огня, сделанную на не очень тяжёлых анимированных спрайтах, под лицензией LGPL (по крайней мере, в стартовом about-home-Fx.js). Не каждый день встретишь качественный огонь на скриптах в браузере. При ближайшем рассмотрении оказалось, что это даже не скрипты, а целиком анимированный CSS. Небольшой скрипт используется только для старта и останова. Используя эту идею и формат, дизайнеры смогут создать свою реализацию огня, дыма или текущей воды.

Поиск по ключевым словам из кода в интернете результата не дал, поэтому, как и с машиной Тьюринга (Гитхаб), тут же возникло желание освободить скрипт и стили от оков случайности и таинственности. То есть, положить его в читаемом и рабочем виде в открытый стабильный источник. Иначе, закончится Олимпиада — и будут все шансы исчезнуть ему из поля зрения. И вот результат:
github.com/spmbt/flame-animate-css-mozilla
Читать полностью »

1...1020...147148149...159
Главная   |  Архив новостей  |   Android  |   Google  |   Apple  |   Microsoft  |   Информационная безопасность  |   Веб – разработка
Публикации RSS  |  Комментарии RSS
https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js