Завоевание CSS, алгоритмически - PullRequest
3 голосов
/ 20 апреля 2011

Прежде чем углубляться в мой вопрос, я должен сначала дать краткий обзор того, с какой стороны я подхожу: для большей части моей работы по веб-разработке (примерно год назад) я почти полностью сосредоточился на внутренней разработке , Поэтому большая часть моих последних месяцев была потрачена на то, чтобы быстро освоить JavaScript, инструменты AJAX, библиотеки JS, манипулирование DOM и, конечно, каскадные таблицы стилей. Я нашел способ адаптировать и использовать свой способ мышления практически ко всем этим аспектам веб-разработки и делать по-настоящему изящные вещи , но CSS по-прежнему остается труднодостижимым для меня , Почти каждый веб-ресурс, с которым я сталкивался, объясняет, как использовать CSS, описывает эту технологию очень просто. До сих пор я не вижу ничего, кроме бесконечного списка примеров макетов и стилей, которые делают их возможным. И, конечно, что еще хуже: часто есть несколько способов достичь одной и той же цели, а также множество фрагментированных «ошибок» для устранения несоответствий в браузере.

Для меня: CSS не полностью функциональный язык программирования (то есть не Тьюринг завершен). Следовательно, изучение CSS похоже на попытку взломать сложный XML-файл, не имея четкого представления о том, как программное обеспечение, использующее указанный файл, будет его интерпретировать. Я ищу алгоритмическое описание точно того, как CSS интерпретируется каждым из основных браузеров (IE, Chrome и FireFox). Для меня это было бы гораздо предпочтительнее чем подход грубой силы, который я был вынужден использовать до сих пор.

Ответы [ 3 ]

3 голосов
/ 20 апреля 2011

CSS действительно другой зверь. Как вы предложили, это не полная Тьюринга . Кроме того, понимание полного языка Тьюринга не очень поможет вам в понимании CSS. Написанное вами правило CSS может применяться или не применяться браузером в зависимости от многих факторов:

  • "Вес"
  • Местоположение
  • Значение
  • Объем
  • Наследование

Для написания CSS вам почти нужно войти в голову браузера :). Но эти ресурсы должны помочь вам:

Прямо от источника: http://www.w3.org/TR/CSS2/cascade.html

Артикул: http://www.vanseodesign.com/css/css-specificity-inheritance-cascaade/


Редактировать

Если вы хотите ознакомиться с реальным кодом, который выполняет эти вычисления (например, Firefox), посмотрите эти файлы по ссылке ниже. Также включены стандартные наборы правил CSS, которые Firefox автоматически применяет к каждой странице.

1 голос
/ 20 апреля 2011

Это официальная страница CSS: http://www.w3.org/Style/CSS/

Вот полная спецификация: http://www.w3.org/TR/CSS21/

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

1 голос
/ 20 апреля 2011

Вы можете попробовать прочитать спецификацию .Я бы посоветовал прочитать хотя бы разделы «Модель коробки» и «Модель визуального форматирования».Если вы понимаете основные концепции, остальное - детали!

...