Что может CSS или 20 советов и секретов CSS

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

1. Закругленные углы.
   

2. [url=http://pro.html.it/esempio/nifty/]Закругленные углы без использования изображений.[/url]

3. [url=http://komodomedia.com/blog/index.php/2005/08/24/creating-a-star-rater-using-css/]Создание «звездных» рейтингов.[/url]

4. [url=http://www.quirksmode.org/css/forms.html]Формы без использования таблиц.[/url]

5. [url=http://css.maxdesign.com.au/listamatic/]Стилизованные списки.[/url]

6. [url=http://glish.com/css/9.asp]Техника разметки двух колонок.[/url]

7. [url=http://glish.com/css/7.asp]Разметка трех колонок.[/url]

8. [url=http://glish.com/css/3.asp]Три колонки по центру фиксированной ширины.[/url]

9. [url=http://www.alistapart.com/articles/goingtoprint]Печать средствами CSS.[/url]

10. [url=http://www.petefreitag.com/item/208.cfm]Добавление стиля CSS в <nobr>RSS-поток.[/url]

11. [url=http://www.themaninblue.com/experiment/footerStickAlt/]«Прилипчивый подвал» (footer)[/url]. Эта техника позволяет сделать такой «подвал», который будет располагаться либо внизу страницы, либо внизу контента, в зависимости от того, что визуально находится ниже.

12. [url=http://www.phoenity.com/newtedge/element_hover/]Эффект «hover».[/url] При наведении курсора элемент меняет свой внешний вид. Работает для текста, для ссылок, для графики и для любых других элементов.

13. [url=http://www.sovavsiti.cz/css/hr.html]Несколько альтернатив для тега горизонтальной разметки (hr).[/url]

14. [url=http://www.positioniseverything.net/easyclearing.html]Перемещение подвижных блоков (floats).[/url] Приводится несколько методов, а также способы решения проблем в разных браузерах.

15. [url=http://www.meyerweb.com/eric/css/edge/popups/demo2.html]Всплывающие окна средствами CSS.[/url]

16. [url=http://www.meyerweb.com/eric/css/edge/boxpunch/demo.html]«Расталкивающие» блоки.[/url] Внедрение элементов с автоматическим изменением границ окружающих блоков.

17. [url=http://usewisdom.com/home/webmaster/css_button.html]Создание кнопок.[/url]

18. [url=http://surf11.com/entry/85/css-xml-rss-button]Оранжевые кнопки RSS и XML средствами CSS.[/url]

19. [url=http://www.evolt.org/article/Ten_CSS_tricks_you_may_not_know/17/60369/]Десять дополнительных советов и секретов CSS.[/url]

20. [url=http://www.webcredible.co.uk/user-friendly-resources/css/more-css-tricks.shtml]Еще десять советов по CSS.[/url]