Визуализация блоков макета CSS

Работая в представлении ≪Дизайн≫, можно делать видимыми блоки макета CSS. Блок макет CSS — это элемент HTML-страницы, который можно расположить в любом ее месте. Точнее блок макета CSS представляет собой либо тег Div, в котором отсутствует display:inline, или любой элемент страницы, содержащий объявления

CSS display:block, position:absolute или position:relative. Далее следует несколько примеров

элементов, считающихся блоками макета СSS в Dreamweaver.

• Тег Div

• Изображение с прикрепленным абсолютным или относительным положением_

• Тег a с прикрепленным стилем display:block

• Параграф с прикрепленным абсолютным или относительным положением_

Примечание. В целях улучшения изображения блоки макета CSS не содержат внутренних элементов (элементов, код которых включен в текстовую строку) или простых элементов блока, таких как параграфов.

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

Следующий список блоков макета CSS описывает то, что Dreamweaver отображает как вспомогательные элементы в каждом случае.

Контур макета CSS Отображает контуры всех блоков макета CSS на странице.

Фон макета CSS Отображает текущие цвета фона отдельных блоков макета CSS и скрывает остальные фоновые цвета и изображения, находящиеся на странице.

Всякий раз при применении наглядных пособий для отображения фона блоков макета CSS, Dreamweaver автоматически присваивает каждому блоку макета CSS собственный цвет фона. (Dreamweaver выбирает цвета с помощью алгоритма - назначить цвета самостоятельно невозможно.) Присвоенные цвета визуально различаются, они были разработаны для того, чтобы помочь дифференцировать блоки макета CSS.

Модель макета CSS Отображает модель фрагмента (с полями) выбранного блока макета CSS.