Положение

Перейдите в окно редактирование CSS стилей, нажав кнопку 

phpKSAah9

Выберите раздел "Положение". В этом разделе можно редактировать отображение и вид выбранного элемента контента на текущей странице.

Шаг 1

1

В поле позиция задаются параметры выбранному элементу.

2

Поле Тип-определяет положение выбранного элемента.


Absolute-обозначает, что элемент абсолютно позиционирован, при этом другие элементы отображаются на веб-странице как будто абсолютно позиционированного элемента нет. Положение элемента задается выравниванием, также на положение влияет значение свойства родительского элемента.
Relative -положение элемента устанавливается относительно его исходного места. Добавление свойств выравнивания изменяет позицию элемента и сдвигает его в ту или иную сторону от первоначального расположения.
Static -элементы отображаются как обычно. Использование свойств выравнивания не приводит к каким-либо результатам.
Значение-можно добавить иное желаемое значение положения элемента.

3

Ширина и высота –определяют значение размера  текущего элемента, их  можно задать в следующих значениях:
Pixels – пиксели, 1px зависит от размера экрана и его параметров;
Points – пункты, 1pt = 1/72 дюйма;
inches – дюймы, 1in = 2,54 см;
Centimetres-сантиметры, сm;
millimeters – миллиметры, mm;
Picas – пикасы, 1pc = 12pt;
ems- высота относительная родительского элемента;
exs- высота символа x , который привязан  к размеру родительского элемента;
%- процентное соотношение по отношению к родительскому элементу.

Поле Видимость-определяет внешний вид редактируемого элемента.

4

Visible-отображает элемент как видимый;
Hidden -элемент становится полностью прозрачным и продолжает участвовать в форматировании страницы;
Inherit -наследует значение родителя.

5

Любые элементы на веб-странице могут накладываться друг на друга в определенном порядке, представляя собой третье измерение, перпендикулярное экрану. Каждый элемент может располагаться ниже или выше других объектов веб-страницы, их размещением по z-оси и управляет Z-индекс. Это свойство работает только для элементов, у которых значение в поле Тип задано как absolute, fixed или relative.
В поле Z-индекс необходимо вводить только целые числа (можно и отрицательные). Чем больше значение, тем выше находится элемент по сравнению с теми элементами, у которых оно меньше

Пункт Переполнение управляет отображением содержания элемента, если оно целиком не помещается и выходит за область заданных размеров.

6

Visible- отображается все содержание элемента, даже за пределами установленной высоты и ширины;
Hidden-отображается только область внутри элемента, остальное будет скрыто;
Scroll-всегда добавляются полосы прокрутки;
Auto-полосы прокрутки добавляются только при необходимости.

Шаг 2

Поле Размещение определяет расстояние от верхнего края родительского элемента до верхнего края текущего  элемента. Отсчет координат зависит от значения свойства Тип. Если оно равно absolute, в качестве родителя выступает окно браузера и положение элемента определяется от его верхнего края  В случае значения relative отсчитывается от верхнего края исходного положения элемента.  

7

Pixels – пиксели, 1px зависит от размера экрана и его параметров;
Points – пункты, 1pt = 1/72 дюйма;
inches – дюймы, 1in = 2,54 см ;
Centimetres-сантиметры, сm;
millimeters – миллиметры, mm;
Picas – пикасы, 1pc = 12pt ;
ems- Высота относительная родительского элемента;
exs- Высота символа x , который привязан  к размеру родительского элемента;
%- процентное соотношение к родительскому элементу.

 

Шаг 3

Свойство Отсечение определяет область элемента, в которой будет показано его содержимое. Все, что не помещается в эту область, будет обрезано и станет невидимым. Установленные параметры в свойстве Отсечение работают при условии, что в поле Тип стоит значение  Absolute .

8

После выбора необходимых параметров для оформления границы элемента  можно нажать кнопку Применить, для того, что бы посмотреть, как будут выглядеть обновления или Обновить, для того, что бы выбранные значения применить  для редактируемого элемента.

Была ли статья вам полезна?
Укажите, пожалуйста, почему?
Комментарий