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

в 8:42, , рубрики: bem, css, html, БЭМ, Веб-разработка, верстка, метки: , , , ,

Вроде закончилась неделя 30 строк кода и взамен ей видимо пришла неделя "БЭМ". Причем прослеживается достаточно забавная очередность топиков:

И самое интересное, как всегда, в комментариях — чистой воды холивар. Но из-за чего? Почему одни свято верят в методологию БЭМ'а, другие презирают её как узурпатора семантичности? Я попробую изложить свою точку зрения на суть всего холивара и прояснить в первую очередь для себя положение БЭМ'а в собственном мироздании.Читать полностью »

в 23:59, , рубрики: css, html, верстка сайтов, метки: , ,

Я хотел написать комментарий к статье о том куда отправляются хорошие верстальщики, но мне стало лень. А потом опять стало не лень, но мыслей накопилось уже на целый пост.

Возьмем самый первый попавшийся пример из приведенной статьи. Там в макете, в самом верху, есть полоска на всю ширину окна:

image

И автор принимает решение сверстать эту полоску с помощью тега <hr>, вот так:

<body class="whitesquare">
  <hr/>
  <!-- вся остальная страница -->
</body>

.whitesquare hr {
  /* стили для полоски  */
}

Это просто супер пример несоблюдения моего правила.

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

в 8:06, , рубрики: css, html, jquery, jquery plugins, tooltip, метки: , , ,

Доброго времени суток уважаемые читатели. Хочу представить вашему взору свой маленький плагин реализованный на jQuery. Плагин призван универсализировать создание всплывающих подсказок (tooltips).
Ранее я находил множество кодов для решения проблем с подсказками и ошибками при валидации, но все они были тяжеловесными и не очень универсальными. Это привело к тому, что я занялся разработкой своего плагина в обход существующим.
Главной задачей, было сделать так, чтобы выводом подсказок можно было управлять, но при этом не лезть в сам JS код.
Второй задачей было впихнуть в код столько функционала, чтобы подсказки могли выводится как слева/справа/снизу/сверху, так и была прилеплена к курсору мыши.
Третей задачей (зачем вообще было реализовывать на JS) было центрирования подсказки, относительно наведенного объекта.
Читать полностью »

в 16:20, , рубрики: bem, css, html, БЭМ, верстка, метки: , , ,

Недавно читатель Mirantus написал статью Как сверстать веб-страницу, в которой рассказывал о том, как же сверстать веб-страничку. В его статье было подробно рассмотрено, как выделить отдельные элементы из заданного шаблона, подобрать шрифты и т.п. Однако его подход к написанию, собственно, веб-страницы мне показался не очень хорошим, о чем я написал в комментариях.

В данной статье я хочу рассказать, о том, как можно сверстать «хорошо» (по крайней мере структурировано ;), а заодно рассказать и о методологии, которая может «упростить жизнь» при верстке. Структура поста будет следующей:

  • BEM
  • Собственно пример — как сверстать страницу

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

в 11:16, , рубрики: dynamic sql, html, reports, sql, sql server, t-sql, XML, метки: , , , , ,

В относительно недавнем прошлом, возникла задача автоматизировать процесс генерации и рассылки HTML отчетов руководству по продажам за текущий месяц. Так уж вышло, что для каждого руководящего лица создавались отдельные таблицы с необходимой только им информацией.

Поскольку, для каждого отчета, все делалось вручную, для начала мы решили воспользоваться возможностями dbForge, который позволял делать экспорт группы таблиц в HTML формат.

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

Было решено генерировать HTML со стороны сервера базы данных и через Database Mail формировать рассылку путем выполнения команды sp_send_dbmail.

Большинство примеров создавали разметку вручную — это было не слишком эффективным подходом. При этом я не нашел универсального решения, позволяющего работать с таблицой имеющей произвольную структуру.

Чтобы заполнить этот пробел предлагаю на рассмотрение мой вариант решения.
Читать полностью »

в 13:34, , рубрики: hi-tech, html, javascript, php, бесплатно, гаджеты и девайсы, призы, розыгрыши, халява

image
Модераторы, перенесите пожалуйста, не могу разместиться в «я пиарюсь»
Добрый день, жители Хабра.

Сегодня я хочу поделиться с Вами небольшим проектом, в котором мы постарались объединить лучшее, что есть в интернете (нет, это не сиськи и котики, т.к. такой портал уже есть, да и сегодня не пятница), а именно — Халява и Гаджеты! Если заинтересовало, то для самых нетерпеливых сразу ссылка, а остальные — добро пожаловать под кат!

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

в 3:03, , рубрики: css, html, html-верстка, tutorial, Веб-разработка, метки: , ,

Уважаемый читатель, этой статьей я открываю цикл статей, посвященных вёрстке.
В первой части будет описано, как это сделать с помощью стандартных средств на чистом HTML и CSS. В последующих частях рассмотрим как сделать тоже самое, но с помощью современных фреймворков и CMS.

Часть 1. Верстка стандартными средствами

Преимущество данной верстки состоит в том, что код получается более «чистым», а значит быстрее загружается и легче изменяется под специфические нужды. Недостаток такой верстки заключается в том, что она требует значительно больше времени, чем при использовании фреймворков.

Итак, давайте приступим. В качестве нашего подопытного мы возьмем бесплатный psd шаблон Corporate Blue от студии Pcklaboratory.
Читать полностью »

в 20:20, , рубрики: api, chrome, css, css3, flexbox, grunt, html, html5, ie11, jquery, JS, sass, Блог компании Zfort Group, браузеры, веб-дизайн, Веб-разработка, дайджест, Интересное, Новости, ресурсы, ссылки, ссылки на сми, метки: , , , , , , , , , , , , , , , , , , , ,

Дайджест интересных материалов из мира веб разработки и IT за последнюю неделю № 83 (10 — 16 ноября 2013)
Читать полностью »

в 19:10, , рубрики: api, css, css3, Firefox, grunt, html, html5, ie11, jquery, JS, sass, Блог компании Zfort Group, браузеры, веб-дизайн, Веб-разработка, дайджест, Интересное, Новости, ресурсы, ссылки, ссылки на сми, метки: , , , , , , , , , , , , , , , , , ,

Дайджест интересных материалов из мира веб разработки и IT за последнюю неделю № 82 (3 — 9 ноября 2013)
Читать полностью »

в 16:29, , рубрики: gif, html, svg, XML, векторная графика, метки: ,

Хитрый способ создания анимированного jpegа
Сегодня с успехом осуществил свой эксперимент по сжатию гифок. Меня давно уже раздражает отсутствие специального формата для сжатия анимированных файлов. Как так, gif есть, а анимированного jpeg нет, хотя для большинства существующих гифок подходит именно jpeg.

От существующих решений, мое отличается тем, что это один файл svg, который можно вставить на страницу через тэг <img>

Под хабракатом находится сжатая версия вот этой гифки tfirma.name/public/leprosorium.ru/cosss_gif/0004w00e.gif
Оригинал весит 6 мегабайт, сжатая версия — 1,3 мегабайта.

Осторожно! Данное решение имеет существенный недостаток, который выражается в высокой загрузке процессора (около 25%). Происходит это только во время загрузки файла, около 1-2 секунд, потом все возвращается в норму.
Читать полностью »

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