Визуальное форматирование

54. Свойство каскадных таблиц стилей - display позволяет определить вид элемента.

Свойство display может принимать значения:

  • inline - встроенный элемент
  • block - блочный элемент.
  • list-item - встроенный элемент списка.
  • marker – задается общее содержимое, появляющееся перед элементом или после элемента. Данное свойство, возможно, использовать только с псевдо-элементами: before (перед) и safter (после),
  • none - отсутствие элемента. Элемент полностью выводится из выходного потока.
  • run-in - элемент типа блочного, свойства которого зависят от его местоположения.
  • compact - элемент типа встроенного, свойства которого зависят от его местоположения
  • inherit - принимается значение родительского элемента.
Пример использования: p {display: block}.

55. Свойство каскадных таблиц стилей - display позволяет определить вид отображения таблиц.

Свойство display в этом случае может принимать значения:

  • table - таблица
  • inline-table - оперативная таблица
  • table-row-group – группа из строк таблицы
  • table-column – отдельный столбец таблицы
  • table-column-group группа из столбцов таблицы
  • table-header-group – сгруппированные верхние заголовки таблицы
  • table-footer-group – сгруппированные нижние заголовки страницы
  • table-row – отдельно взятая строка таблицы
  • table-cell – отдельная ячейка таблицы
  • table-caption – заголовок таблицы.

56. При визуальном форматировании свойство width задает ширину элемента. Данное свойство может принимать следующие значения:

  • auto - ширина элемента определяется броузером
  • любое число, соответствующее стандартам длины принятым в CSS
  • значение, выражающее сотношение в процентах ширины элемента к ширине окна
Пример использования: p {width: 260px}

57. Минимальное и максимальное значение ширины элемента определяют свойства - min-width, max-width, которые могут принимать в качестве входных значений следующие параметры:

  • любое число, соответствующее стандартам длины принятым в CSS
  • значение, выражающее сотношение в процентах минимальной или максимальной ширины элемента к ширине окна.
  • none - ширина не ограничивается; (значение применяется только к свойству max-width)
  • inherit - принимается значение родительского элемента.
Пример использования: div {min-width: 100pх; max-width: 400px}

58. При визуальном форматировании свойство height задает высоту элемента. Данное свойство может принимать следующие значения:

  • auto – высота элемента определяется броузером или содержимым элемента.
  • любое число, соответствующее стандартам длины принятым в CSS
  • значение, выражающее сотношение в процентах высоты элемента к высоте окна
Пример использования: p {height: 260px}

59. Минимальное и максимальное значение высоты элемента определяют свойства - min- height, max- height, которые могут принимать в качестве входных значений следующие параметры:

  • любое число, соответствующее стандартам длины принятым в CSS
  • значение, выражающее сотношение в процентах минимальной или максимальной высоты элемента к высоте окна.
  • none - высота не ограничивается; (значение применяется только к свойству max- height)
  • inherit - принимается значение родительского элемента.
Пример использования: div {min- height: 100pх; max- height: 400px}

60. Свойство line-height позволяет определить расстояние между базовыми линиями соседних строк (интерлиньяж). Свойство может принимать значения:

  • normal - по умолчанию браузер стремиться расположитьна странице все элементы.
  • число, представляющее высоту элемента.
  • процентное отношение высоты элемента к высоте окна.
  • число, равное количеству кеглей используемого шрифта.
  • inherit - принимается значение родительского элемента.
Пример использования: p {line-height: 2.2}

61. Вертикальное выравнивание текста внутри элемента достигается применением свойства vertical-align со следующими параметрами:

  • baseline – базовая линия элемента выравнивается по базовой линии родителя
  • middle – средняя линия элемента выравнивается по базовой линии родителя
  • любое число, соответствующее принятым в CSS стандартам длины.
  • процентное соотношение, показывающее, на сколько поднят уровень элемента. Отрицательные числа показывают, на сколько уровень элемента ниже.
Пример использования: p{vertical-align: super}

62. Свойство float позволяет задать обтекание элемента с правой или левой стороны. Свойство может принимать следующие значения:

  • none - элемент не обтекается (по умолчанию).
  • left – обтекание элемента справа
  • right – обтекание элемента слева
Пример использования: img {float: right}

63. Свойство каскадных таблиц стилей - clear определяет, каким образом данный элемент обтекается другими элементами. Данное свойство может принимать следующие значения:

  • none - обтекание доступно со всех сторон
  • left – запрет на обтекание слева
  • right – запрет на обтекание справа
  • both – запрет на обтекание элемента с двух сторон
Пример использования: img {clear: both}

64. Свойство overflow определяет поведение элемента, когда размеры его содержимого не соответствуют размерам блока изображения, установленного свойствами: top, left, width, height. Бданное свойство может принимать значения:

  • visible – заставляет элемент сжаться или увеличиться, чтобы полностью отобразится в данном блоке.
  • hidden – обрезает элемент в соответствии с размерами блока
  • auto – добавляются полосы прокрутки к блоку отображения в случае, если размеры содержимого превосходят размеры изображения.
Пример использования: img {overflow: visible}

65. Свойство каскадных таблиц стилей – visibility позволяет управлять отображением элемента. Значения свойства:

  • visible – элемент отображается
  • hidden – элемент не отображается, но не изымается из выходного потока.
Пример использования: img {visibility: visible}

66. Свойство таблиц стилей clip дает возможность обрезать края изображения для абсолютно позиционируемого элемента. Значения свойства:

  • auto – отсечения границ не происходит
  • rect (top, right, bottom, left)-вырезаемая область определяется значениями сдвига соответственно сверху, справа, снизу и слева.
Img {clip: rect (5px, 4рх, 2рх, 4рх)}

67. Свойство direction задает направление текста в элементе. Свойство может принимать значения:

  • Itr - слева направо (по умолчанию).
  • rtl - справа налево.
Пример использования: body {direction: Itr; unicode-bidi: embed}

68. Свойство каскадных таблиц стилей unicode-bidi позволяет изменить направление текста в блоке. Данное свойство может принимать следующие значения:

  • normal – изменение направления запрещено
  • embed – разрешено изменение направления при помощи свойства direction.
  • bidi-override – разрешает изменять направление текста при помощи свойства direction применительно к дополнительным блокам текста
Пример использования: body {unicode-bidi: embed}

69. Свойство cursor позволяет задать вид указателя мыши при прохождении по элементу.
В зависимости от кодового слова, корсор меняется следующим образом:

  • auto - внешний вид определяется браузером
  • crosshair – указатель "графическое выделение".
  • default – вид курсора по умолчанию.
  • pointer – вид курсора "выбор ссылки".
  • move – вид курсора "перемещение".
  • e-resize, ne-resize, nw-resize, n-resize, se-resize, sw-resize, s- resize, w-resize - принимает формы курсора, характерные для изменения размеров.
  • text - вид курсора как при выделении текста.
  • wait - вид курсора "система недоступна".
  • help - вид курсора "выбор справки".
  • URL файла указателя мыши.
Пример использования: img {cursor: pointer}

70. В IE с помощью свойства zoom можно масштабировать элементы. Для этого, необходимо задать свойству либо числовое значение с плавающей запятой, либо значения, выраженное в процентном отношении, где нормальному размеру соответствует значение – 100%. Пример использования:

img {zoom: 2.0} /*Элемент увеличен в два раза*/
div {zoom: 300%} /*Элемент увеличен в три раза*/





автоперевозки в Иркутск