position свойство в CSS позволяет Вам управлять местоположением элемента. Рядом с inherit значение, существует четыре определенных значения, на которые оно может быть установлено:

• static для расположения элемента согласно "нормальному потоку". Это - значение по умолчанию и не должно быть установлено.

• relative для расположения подобного static, хотя с определенным смещением относительно его нормального положения

• absolute для расположения элементов вдоль системы координат относительно элемента, "содержащего блок"

• fixed для расположения элементов с помощью системы координат, которая прикреплена к источнику поверхности отображения (обычно источник клиентской области окна браузера включения)

• sticky для расположения элемента как родственник, пока определенный порог прокрутки не был достигнут, в которую точку элемент расположен как фиксированный элемент.

CSS, располагающий часто, полагается на дополнительные свойства макета (такой как top, bottom, left, right, z-index, и clip) для достижения желаемого результата.

Пример

/* static */ element { position: static; } /* relative */ element { position: relative; top: 65px; left: 65px; } /* absolute */ element { position: absolute; top: 40px; left: 40px; } /* sticky */ element { position: sticky; top: 20px; } 

Ссылки

1. Расположение схем - спецификация W3C
2. Положение CSS - ссылка MDN

---------121 язык--------61859----, записанный для единственной цели добавить прохладные, изобретательные опции к CSS при требовании минимального, все же эффективного, кода. Они делают это путем компиляции кода, написанного в reg …

Введение

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

Функции

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

Переменные

Переменные помогают управлять многими свойствами ссылки, просто управляя переменной.
Пример:

$mainColor: blue; body { color: $mainColor; } 

Несколько других функций, таких как mixins и импортирующие стили, используют похожий метод объявления переменных или ряда стилей однажды, и ссылка на него позже.
Это может сохранить много временного и дублирующего кода.

Вложение

Вложение используется, когда несколько элементов совместно используют того же родителя (родителей) в нашем CSS, интуитивно ускоряя запись.
Необработанный CSS:

section { margin: 10px; nav { height: 25px; } } 

CSS после компиляции:

section { margin: 10px; } section nav { height: 25px; } 

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

Популярные препроцессоры

• дерзость - документация
• скрыть - документация
• стилус - документация
• csscrush - документация
• myth - документация