12788

Боксовая модель в CSS

Практическая работа

Информатика, кибернетика и программирование

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

Русский

2013-05-03

24.21 KB

10 чел.

Боксовая модель

Боксовая модель в CSS описывает боксы, генерируемые для HTML-элементов. Боксовая модель также имеет детальные опции для определения полей, рамок, заполнения и содержимого каждого элемента. На диаграмме далее показано, как построена боксовая модель:

Боксовая модель в CSS


Эта иллюстрация может показаться слишком научной, поэтому попытаемся использовать эту модель на конкретном примере с заголовком и текстом. HTML нашего примера таков (из Всеобщей Декларации Прав Человека):

<h1>Article 1:</h1>

<p>All human beings are born free

и equal in dignity и rights.

They are endowed with reason и conscience

и should act towards one another in a

spirit of brotherhood</p>

Добавив цвет и информацию шрифта этот пример можно представить так:

В этом примере - два элемента : <h1> и <p>. Боксовая модель этих элементов выглядит так:

Хотя это может показаться немного сложным, тем не менее, видно, что каждый HTML-элемент окружён боксом. Боксом, который можно настроить с помощью CSS.

Резюме

В этом уроке вы узнали о боксовой модели. В следующих трёх уроках подробнее остановимся на том, как создавать элементы и управлять ими в боксовой модели.


 

А также другие работы, которые могут Вас заинтересовать

17134. Створення документа. Режими відображення. Редагування та форматування тексту 61.5 KB
  Лекція №10 Тема: Створення документа. Режими відображення. Редагування та форматування тексту. План Створення документа. Режими відображення. Редагування тексту. Форматування текстового документа в Word. Створення документа Під створенням д
17135. Стилі і шаблоні. Теми. Макроси 60.5 KB
  Лекція №11 Тема: Стилі і шаблоні. Теми. Макроси. План Стилі. Створення стилю. Теми. Макроси. Стилі Наймогутнішим засобом автоматизації введення і редагування в Word є стилі. Існує два підходи до форматування оформленню документа. Перший істори...
17136. Табличні процесори. Загальні відомості. Меню Excel. Осередки. Введення інформації 74.5 KB
  Лекція №12 Тема: Табличні процесори. Загальні відомості. Меню Excel. Осередки. Введення інформації. План Інтерфейс вікна Excel. Загальні відомості. Обчислення в електронних таблицях. Автоматизація введення. Особливість електронних таблиць полягає в...
17137. Формули. Арифметичні операції. Операторі відношення. Зведені таблиці. Список. Сортування, фільтр, форма 181.5 KB
  Лекція №13 Тема: Формули. Арифметичні операції. Операторі відношення. Зведені таблиці. Список. Сортування фільтр форма. План Формули. Арифметичні операції. Операторі відношення. Зведені таблиці. Сортування фільтр форма. Формули. Обчисленн
17138. Майстер функцій. Функції логіки. Математичні функції 122 KB
  Лекція №14 Тема: Майстер функцій. Функції логіки. Математичні функції. План Майстер функцій. Функції логіки. Математичні функції. Функції Функції наперед певні формули які виконують обчислення по заданих величинах званих аргументами і у вк...
17139. Матричні функції. Матрична операція. Статистичні функції. Функції категорії: Дата і час 128 KB
  Лекція №15 Тема: Матричні функції. Матрична операція. Статистичні функції. Функції категорії: Дата і час. План Матричні функції. Матрична операція. Статистичні функції. Функції категорії: Дата і час. МОБР повертає зворотну матрицю для матриці ...
17140. Робота з графічними зображеннями. Створення діаграм. Захист комірок 65.5 KB
  Лекція №16 Тема: Робота з графічними зображеннями. Створення діаграм. Захист комірок. План Побудова діаграм і графіків. Різновиди діаграм. Захист комірок книг та листів. Побудова діаграм і графіків Графічне уявлення також може допомогти знайти п...
17141. Загальна характеристика СУБД Access. Реляційна модель даних 165 KB
  Лекція №17 Тема: Загальна характеристика СУБД Access. Реляційна модель даних. План Поняття бази даних. Моделі організації даних. Загальна характеристика СУБД MS Access. Основні етапи розробки бази даних в середовищі MS Access. Поняття бази даних Базу д