Еще один блог :)

Вопросы по CSS - Часть 3

  1. Расскажите о модели форматирования HTML элементов
  2. На какие типы по форматированию делятся HTML элементы
  3. Что такое блочные элементы, примеры
  4. Что такое строчные элементы, примеры
  5. Что такое плавающий элемент
  6. Как указать размер блочного элемента
  7. Что такое Flexbox?
  8. Что такое CSS Grid?
  9. Приведите пример верстки с помощью CSS Grids
  10. Приведите пример верстки со вложенными (nested) гридами

21 HTML документ состоит из элементов HTML. Каждый элемент отображается как обособленная единица визуального представления на основе контейнерной модели.

Контейнер данных - прямоугольник с содержимым

Контейнер отступов - прямоугольник, окружающий контейнер данных

Контейнер границ - прямоугольник, окружающий контейнер данных

Контейнер полей - прямоугольник, окружающий контейнер границ

Внутрь контейнера данных могут быть вложены контейнеры с дочерними элементами, которые унаследуют одноименные стили из родительского элемента

22 По типу представления элементы HTML делятся на блочные и линейные

23 Блочные элементы отображаются как прямоугольники, занимающие всю ширину родительского элемента. Примеры: p, pre, li, table, form, div, h1, hr

24 Линейные элементы - это небольшие по высоте прямоугольные элементы, которые укладываются горизонтально вдоль линииж Если ширина родительского элемента исчерпана, выполняется усечение и перенос на новую строку. Совокупность 1 и более линейных элементов образует блочный элемент. Примеры: img, strong, em, input, span, a, hr

25 Плавающий элемент - это блочный или линейный элемент, имеющий свойство float. 

Если float равен left, то элемент будет прижат к левой границе родительского блока, а все остальные дочерние элементы будут прижаты к правой границе очередного предыдущего дочернего блока

Если float равен right, то элемент будет прижат к правой границе родительского блока, а все остальные дочерние элементы будут прижаты к левой границе очередного предыдущего дочернего блока

26 Используют свойства width и height

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

28. Это двумерная система компоновки, основанная на сетке, которая может обрабатывать как колонки так и строки, в отличии от Flexbox, который является по сути одномерной системой

29. Верстка

30. Верстка со вложенными гридами. Используем функцию repeat с параметром auto-fill для адаптивного изменения количества колонок и значением параметра ширины колонки с помощью функции minmax, определяее минимальную ширину и задавая максимальную как одну фракцию


Документация и обзоры

×