Css поля

CSS властивості полів визначають простір навколо елементів.

Поле очищає простір навколо елемента (за межами кордону). Поля не має кольору фону і є повністю прозорим.

Верхнє (top), праве (right), нижня (bottom) і ліве (left) поля можуть змінюватися незалежно, використовуючи різні властивості. Стенографічне властивість полів (margin) також може бути корисно, щоб змінити все поля одночасно.

Можливі значення

Браузер встановлює поля.
Результат цього значення залежить від браузера

Визначає фіксоване поле (в пікселях, пунктах, одиницях em, і т.д.)

Визначає поле в% від що містить елементи

Поля - Індивідуальні Значення для Сторін

У CSS можна вказувати різні поля для різних сторін:

margin-top: 100px;
margin-bottom: 100px;
margin-right: 50px;
margin-left: 50px;


Спробуйте самі »
Клацніть на кнопці "Спробуйте самі" щоб побачити як це працює

Поля - стенографічний Властивість

Щоб скоротити код, можна вказати всі властивості полів в одну властивість. воно називається стенографічним властивістю.

Стенографічне властивість чекаючи все властивостей полів - "margin":


Спробуйте самі »
Клацніть на кнопці "Спробуйте самі" щоб побачити як це працює

Властивість margin може мати від одного до чотирьох значень.

  • margin: 25px 50px 75px 100px;
    • верхнє поле одно 25px
    • праве поле одно 50px
    • нижнє поле одно 75px
    • ліве поле одно 100px

  • margin: 25px 50px 75px;
    • верхнє поле одно 25px
    • праве і ліве поля рівні за 50px
    • нижнє поле одно 75px

  • margin: 25px 50px;
    • верхнє і нижнє поля рівні за 25px
    • праве і ліве поля рівні за 50px

  • margin: 25px;
    • всі чотири поля рівні за 25px

Встановити верхнє поле тексту, використовуючи значення в cm
Цей приклад демонструє як встановити верхнє поле тексту, використовуючи значення в cm.

Встановити нижнє поле тексту, використовуючи значення в%
Цей приклад демонструє як встановити нижню в% щодо ширини елемента-контейнера

Всі CSS Властивості Полів

Схожі статті