Главная » Записи с тегом "CSS код"

Рубрики с меткой ‘CSS код’

Сокращение времени загрузки веб-страниц с помощью CSS

1. Избегайте использования таблиц для разметки страницы

Вот шесть причин, по которым лучше использовать CSS, а не таблицы, для разметки страниц:

* Браузеры анализируют таблицы дважды: первый раз для того, чтобы оценить структуру таблицы, и второй — для орпреления их содержимого.
* Таблицы отображаются сразу полностью, а не по мере загрузки. Читать далее »

Выравнивание блоков по центру в CSS

Выравнивание содержимого по горизонтали, которое имеет свойство float, можно сделать очень легко и кроме того полностью кроссбраузерно (работает в Opera 8+, Firefox 3+, IE 5.5+).

Пример выравнивания div-блока

Чтобы выравнять блок со свойством float или несколько расположенных в ряд блоков, необходим еще один внешний блок. Внешнему блоку и внутренним блокам назначается position: absolute; и float: left;, внешнему назначить left: 50%;, а внутренним блокам right: 50%;. Для использования float: right; нужно назначить внешнему назначить right: 50%;, а внутренним блокам left: 50%;. Рекомендую очищать float, размещая после выравненных по центру элементов блок со свойством clear: both;. Читать далее »

Добавляем иконку предзагрузки к большим изображениям при помощи CSS

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

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

1. Находим иконку предварительной загрузки Читать далее »

Закрепление блока с position:fixed

За столь продолжительный период верстки сегодня мне впервые пришлось столкнуться с необходимостью разместить на странице фиксированный блок (используя CSS-свойство position:fixed), который бы при скролле страницы всегда сидел в одном месте окна браузера.

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

Gavern Framework – Разметка Часть 2

Gavern Framework – Разметка Часть 2

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

Отступы в шаблоне

Файл layout.сss включает в себя CSS код, который создает наиболее важные отступы в шаблоне. Самой важной вещью создающая отступы в шаблоне является группа классов gkPadding, которые добавляют буквы TBLR в конец – отдельно буквы означают Читать далее »

Как справиться с пустыми элементами в WordPress

По умолчанию WordPress размещает комментарии в параграфах (HTML-тегах p). Наряду с этим, в WordPress используются различные теги шаблонов, которые могут в определенных ситуациях приводить к появлению пустых HTML-тегов:

01 <p></p>
02 <p><!-- --></p>

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