Генератор форм

Для веб-мастера

Реклама


Все заметки с меткой «css»

Резиновая вёрстка: используем отрицательные поля

Рейтинг:
Дата: 17 февраля 2010 Просмотров: 9774
Категория: HTML и CSS

Я недавно столкнулся с задачей, в которой надо было создать двухколоночный макет страницы с "шапкой" и "подвалом", причём в коде страницы контент должен был быть расположен перед блоком боковой колонки. Я решил воспользоваться возможностью продемонстрировать малоизвестный приём CSS-вёрстки: отрицательные поля (negative margins). Отрицательные поля позволяют нам сместить область контента за границы окна браузера, освободив место для боковой колонки.

Постановка задачи

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

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

Читать дальше

Умные динамические колонки с применением CSS и jQuery

Рейтинг:
Дата: 10 февраля 2010 Просмотров: 12059
Категория: Веб-программирование

Существует два типа колонок, используемых на веб-сайтах: фиксированной ширины и тянущиеся в ширину в зависимости от размера экрана (их еще называют “резиновыми”).

Недостатком фиксированных колонок при их использовании в “резиновом” блоке является то, что может появляться лишнее незаполненное пространство (при определенной ширине блока), поскольку его ширина меньше ширины столбца:

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

Читать дальше

Генератор HTML+CSS шаблонов

Рейтинг:
Дата: 9 декабря 2009 Просмотров: 15842
Категория: Полезные сервисы

Сегодня хотелось бы рассказать об одном интересном онлайн-сервисе, который я совсем недавно нашел. Называется он "Генератор HTML+CSS шаблонов"

Как известно, любой сайт создается по какому-то шаблону. Это может быть шаблон состоящий из шапки сайта, боковых колонок (сайдбар), панели навигации и подвала.

Так вот данный сервис, занимается генерацией таких шаблонов!

Читать дальше

Выпадающие меню на HTML и CSS

Рейтинг:
Дата: 8 июня 2009 Просмотров: 128343
Категория: HTML и CSS

Каждый, кто решил создать свой сайт, сталкивается с потребностью создания симпатичного меню для своего сайта. В этой статье я расскажу, как при помощи обычного HTML-кода и несложных CSS-правил, можно создать отличное выпадающее меню, которое легко менять и дополнять. И для этого нам не понадобится никакой JavaScript-код!

Давайте посмотрим какое меню у нас получится

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

Читать дальше
Страницы:

Облако тегов

Нашли ошибку в тексте

Система Orphus

Простая CRM

Твиттер Facebook Google plus RSS