|
|
| (не показана 1 промежуточная версия этого же участника) |
| Строка 1: |
Строка 1: |
| '''CSS''' — язык разметки документов в [[Интернет]]е, одна из трех основ современного Интернета вместе с [[HTML]] и [[JavaScript]]. Предназначается для описания стилей элементов веб-страницы (размеров, отступов, цвета и т. п.), так что на самой странице приводятся только классы и идентификаторы элементов, что позволяет разделить труд страницесоздавателя и дизайнера, кроме того сокращается размер страницы и улучшается читаемость. Фактически, является языком шаблонов, если в HTML имеется элемент <nowiki><div class="ppk"></nowiki> и в CSS прописаны стили для div.ppk, то происходит как бы подстановка этих стилей и выходит, что отображается <nowiki><div style="тут стили"></nowiki>. | | '''CSS''' — язык разметки документов в [[Интернет]]е, одна из трех основ современного Интернета вместе с [[HTML]] и [[JavaScript]]. Предназначается для описания стилей элементов веб-страницы (размеров, отступов, цвета и т. п.), так что на самой странице приводятся только классы и идентификаторы элементов, что позволяет разделить труд страницесоздавателя и дизайнера, кроме того сокращается размер страницы и улучшается читаемость. Фактически, является языком шаблонов, если в HTML имеется элемент <nowiki><div class="ppk"></nowiki> и в CSS прописаны стили для div.ppk, то происходит как бы подстановка этих стилей и выходит, что отображается <nowiki><div style="тут стили"></nowiki>. |
| {{YouTube|xuqoe6jzMF0|Основы верстки CSS и HTML|width=350}}
| |
| [[Файл:Sample-css-snapshot-1140x694.jpeg|thumb|350px|Пара строчек кода, немного меда — и при наведении мышою на элементыч изменяются его стили (за это отвечает особо хитрый атрибут: focus, помещаемые сразу после селектора-выбирателя)]]
| |
| В подавляющем большинстве используется как средство описания, оформления внешнего вида веб-страниц, написанных с помощью языков разметки HTML и [[XHTML]], но может также применяться к любым XML-документам, например, к [[SVG]] или [[XUL]]. | | В подавляющем большинстве используется как средство описания, оформления внешнего вида веб-страниц, написанных с помощью языков разметки HTML и [[XHTML]], но может также применяться к любым XML-документам, например, к [[SVG]] или [[XUL]]. |
|
| |
| == История ==
| |
| По распространённым в интернете слухам, первый кто предложил концепцию отделения описания дизайна от текста и собственно сам стандарт CSS, был некто Хокон Виум Ли (норвежский учёный, специалист в области информатики) из компании [[Opera Software]]. Да да, из той самой Оперы Софтверэ, которая занимается разработкой, поддержкой и внедрением на массовый рынок браузера [[Opera]], хотя последняя уже не так, хотя когда она была той остаётся загадкой для многих и сегодня. После того «предложения» W3C полностью поддерживает данную парадигму и разрабатывает CSS радуя всех веб дизайнеров и верстальщиков новыми стандартами и рекомендациями. В то же время производители популярных веб раузерных движков как то под час расстраивают своим слоупокстом по внедрению стандартов в обиход.
| |
|
| |
| Первая вариация CSS была создана в 1996. Были возможности описать размер и цвет шрифта, величину отступов. В качестве верстки необходимо было использовать громоздкие таблицы без видных границ, при помощи которых на старых веб-сайтах производилось все позиционирование. Возможности были ограничены.
| |
|
| |
| Вторая вариация была внедрена достаточно быстро, уже в 1998, так как оказалось, что возможностей CSS совершенно не хватает для создания развитых документов. Появились могучие блоки div, которые стало возможно распределять по странице с использованием абсолютного позиционирования, улучшились возможности по поиску необходимого элемента в документе.
| |
|
| |
| Третья редакция появилась в 2000-х и применяется и в настоящее время. Существенно повысились возможности описания стилей, добавилась возможность создавать сложные объекты вроде градиентов и теней, анимированных изображений без использования скриптов, появились пространства имён и улучшенные селекторы.
| |
|
| |
| Это наиболее развитая версия версия, известная всем верстальщикам каскадных таблиц стилей. Предложен консорциумом всемирной паутины сравнительно н давно и полностью поддерживается далеко не во всех браузерах (об ослике и говорить не приходится, ибо на него уже все давно забили) и по сей день. Тем не менее наворотов там уйма, что симпатизирует абсолютно всем и в особенности тем, кто не знает JavaScript ибо теперь и они могут делать красивые (движущиеся) динамические web-страницы.
| |
|
| |
| Отличием данной версии пожалуй является то, что в рунете практически не реально найти адекватной документации по этому стандарту. Есть конечно попытки, но всё как то не так. Посему читать документацию лучше в первоначальном источнике, т.е. на официальном сайте консорциума всемирной паутины. Благо там пишут грамотные ребята и всё оформлено по высшему классу.
| |
|
| |
| Ныне на большинстве сайтов CSS-стили хранятся в отдельном файле (или файлах) и добавляются в заголовочные места документа, подгружаются автоматически и сразу же применяются. Стили сложных сайтов могут быть весьма массивными, хоть обычно и не такими большими, как JavaScript и картинки.
| |
|
| |
| == Особенности ==
| |
| Исторически далеко не все браузеры работали корректно с версией CSS от W3C и старались внедрить собственные стили и особенности, что сильно давило на мозги дизайнеров сайтов — выходило так, что надо было проверять правильное отображение страницы на нескольких браузерах, причем возникала необходимость писать специальные правила для разных браузеров (особенно в этом отличался старый [[Internet Explorer]], игнорировавший стандарты и нередко отображающий страницы криво). Постепенно это всё нормализовалось, так как IE ушел в прошлое.
| |
|
| |
| Сложность тестирования под обычные и мобильные версии, впрочем, привела к тому, что многие сайты имеют отдельные версии, естественно, с отдельными стилями (слишком отличается размер экранов и масштаб, чтобы пытаться сделать одну и ту же версию под компьютер и [[смартфон]]).
| |
|
| |
| {{nav|Software|Интернет}}
| |
|
| |
|
| [[Категория:Интернет]] | | [[Категория:Интернет]] |