Как я могу преодолеть мою путаницу из-за CSS?

Question

Я заинтересован в улучшении моего понимания CSS.Некоторое время я делал веб-страницы, но меня все еще постоянно беспокоит странное поведение, которое я не могу объяснить, когда пытаюсь заставить вещи выглядеть так, как я хочу.У меня большой опыт разработки, и у меня нет проблем с пониманием тонкостей Javascript, PHP или даже C. Но когда дело доходит до CSS и HTML, я обнаруживаю, что всегда пытаюсь «обмануть» свой код в работе.

Это должно означать отсутствие понимания с моей стороны о том, как на самом деле работают веб-страницы и CSS.Есть ли какие-нибудь хорошие книги или ресурсы, на которые я мог бы взглянуть в конце, чтобы по-настоящему понять, что происходит под капотом?Я всегда чувствую, что я в растерянности, но я подозреваю, что мог бы справиться с этим, если бы просто подавился и немного почитал.

Answer 1

Я нахожу, что я всегда пытаюсь "обмануть" мой код в работе.

Да.CSS часто заключается в создании иллюзии эффекта, который вы намереваетесь, а не в том, чтобы фактически делать то, что вы намереваетесь.

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

Несмотря на то, что он часто мертв, есть несколько пользователей SO, которыерегулярно проверяю CSS-чат (включая меня), поэтому, если у вас есть общие вопросы (неуместные для настоящего вопроса SO), не стесняйтесь их задавать, и кто-нибудь в конечном итоге отправит вам ответный звонок.

Кроме того, я создал Полезные ссылки CSS документ со ссылками на официальные документы, несколько учебных пособий и другие ресурсы CSS.

Answer 2

Вы можете быть загипнотизированы милыми мигающими огнями и забыть посмотреть, как все связано друг с другом.Точно так же, как вы слишком сосредоточены на том, как ваш Javascript влияет на узел в DOM, вы не можете забыть о родителях, братьях и сестрах и о том, как они все сочетаются друг с другом.Ваши самые большие проблемы, вероятно, позиционирования.Помните, как все элементы связаны друг с другом, и это решит много путаницы.

Answer 3

Я уверен, что вы уже были здесь, но на всякий случай:

Изучите CSS: http://w3schools.com/css/default.asp

Изучение CSS3: http://w3schools.com/css3/default.asp

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

Тем не менее, изучение этого материала является взрывом и действительно полезным, когда вы справитесь с этим. Удачного кодирования!