20 советов и секретов CSS

Вебпланета

≡ Архив | архивная статья | 04.10.2005 13:39

Даже опытные веб-разработчики долго не могут привыкнуть к тому, что с помощью CSS можно сделать практически что угодно — от разметки колонок до кнопок и всплывающих окон.

Технология Cascading Style Sheets позволяет контролировать практически любые элементы дизайна — от размера шрифтов до цветовой гаммы отдельных блоков. Более того, CSS способна сделать гораздо больше. Пит Фрайтаг в своем блоге, посвященном веб-программированию, опубликовал 20 советов и секретов по CSS, подобрав примеры не совсем стандартного использования этой технологии. Каждый пример включает не только демонстрацию оригинального эффекта, но и подробное описание способа его создания.

1. Закругленные углы.
2. Закругленные углы без использования изображений.
3. Создание «звездных» рейтингов.
4. Формы без использования таблиц.
5. Стилизованные списки.
6. Техника разметки двух колонок.
7. Разметка трех колонок.
8. Три колонки по центру фиксированной ширины.
9. Печать средствами CSS.
10. Добавление стиля CSS в RSS-поток.
11. «Прилипчивый подвал» (footer). Эта техника позволяет сделать такой «подвал», который будет располагаться либо внизу страницы, либо внизу контента, в зависимости от того, что визуально находится ниже.
12. Эффект «hover». При наведении курсора элемент меняет свой внешний вид. Работает для текста, для ссылок, для графики и для любых других элементов.
13. Несколько альтернатив для тега горизонтальной разметки (hr).
14. Перемещение подвижных блоков (floats). Приводится несколько методов, а также способы решения проблем в разных браузерах.
15. Всплывающие окна средствами CSS.
16. «Расталкивающие» блоки. Внедрение элементов с автоматическим изменением границ окружающих блоков.
17. Создание кнопок.
18. Оранжевые кнопки RSS и XML средствами CSS.
19. Десять дополнительных советов и секретов CSS.
20. Еще десять советов по CSS.