Задачи по основам CSS призваны закрепить работу с набором базовыми CSS понятиями: CSS селекторы, CSS-свойства, каскадность, CSS-свойства для работы с текстом, оформление фона HTML-элементов и работа с бордюрами. От понимания основ CSS зависит дальнейшая работа верстальщика. Важно помнить, что в отличие от спецификации HTML, о CSS можно прочитать в отдельных модулях W3. Читать далее… Читать далее Задания по основам CSS
Рубрика: CSS стили
Заметки в рубрике охватывают работу с CSS
Задания: float CSS
Задания: float CSS
Обтекание в HTML и CSS — хорошая возможность разместить блоки на одном уровне или построить многоколоночную страницу. Владея свойством float, можно отчасти управлять блочностью элемента, а зная как решать проблемы с обтеканием — не тратить время на поиски «ошибок». Задачи на обтекания предполагают, что Вы владеете этим свойством или имеете эквивалент знаний соответствующий полученным на курсах по HTML. Примечание: также надо хорошо уметь пользоваться отменой обтекания. Читать далее Задания: float CSS
Задания: CSS селекторы
Для уверенной верстки, требуется в идеале знать селекторы CSS: css селекторы классов, css селекторы атрибутов, соседние селекторы css, контекстные селекторы css, дочерние селекторы +в css, приоритет селекторов (нахождение приоритета, специфичность селектора), группировка селекторов, селектор первый элемент, селектор по id. Читать далее Задания: CSS селекторы
Календарь HTML
На курсах по JavaScript мы иногда затрагиваем тему построения HTML-календаря. Каркас календаря запрограммировать достаточно быстро, а вот на оформление CSS-стилями время тратить не хочется, потому было решено заранее прописать эти стили отдельной заметкой в блоге для дальнейшего быстрого применения. Пусть у нас есть календарь на июль 2084 года, сверстанный в HTML (фидл). Связь JavaScript с календарем обсудим в какой-нибудь из дальнейших заметок, сейчас лишь заметим, что заполнять подобный календарь вручную (название месяца в HTML-элементе caption, дни недели в th, дни месяца в td), без программирования, на практике никто не будет. Читать далее Календарь HTML
Обтекание в HTML и CSS
Если вы не очень хорошо понимаете как работает обтекание в HTML и CSS (свойство float), то эта заметка поможет сориентироваться. Свойство CSS float часто применяется для расположения двух и более блоков в одну линию. Верхняя часть этих блоков находится на одном уровне, нижняя — в зависимости от высоты блоков. Сами блоки «плывут» влево (float:left) или вправо (float:right). Есть еще значение none, оно отключает обтекание (работу float) для конкретного элемента с float: none Читать далее Обтекание в HTML и CSS
Анимация в CSS
Анимация в CSS — очень интересная возможность для создания подвижных фрагментов на сайте. Двигать (а также менять цвет, размеры и т.д.) можно при помощи свойств начинающихся на animate-property, где вместо property подставляется одно из слов: name, duration, timing-function, iteration-count, direction, play-state, delay, fill-mode. Но можно записать сокращенный формат animation, описав все внутри. Почти как background. CSS анимация позволяет менять значения свойств, например можно изменить цвет элемента и поменять его расположение. Читать далее Анимация в CSS
Документация по CSS
Когда начинаем изучать HTML , документацию найти достаточно просто. А спецификация CSS разбита на модули. Один модуль — документ с самостоятельным описанием. Посвящены они работе с цветом фона элементов и бордюрами/рамками, шрифтом, медиа-запросами и т.д. Общий список модулей можно найти на странице текущей работы над CSS. Там же предлагается посетить страницу со списком CSS-свойств и быстрым переходом от свойства к странице спецификации нужного модуля.