CSS Межі
Властивості CSS Border - Межа
CSS властивості border
дозволяють вказати стиль, ширину і колір межі елемента.
У мене межі з усіх боків.
У мене червона нижня межа.
У мене округлі межі.
Стиль CSS Межі
Властивість border-style
визначає, яку межу відображати.
Допускаються наступні значення:
dotted
- Визначає крапкову межу.dashed
- Визначає пунктирну межу.solid
- Визначає суцільну межу.double
- Визначає подвійну межу.groove
- Визначає тримірну рифлену межу. Ефект залежить від значення кольору межі.ridge
- Визначає тримірну ребристу межу. Ефект залежить від значення кольору межі.inset
- Визначає внутрішню тримірну межу. Ефект залежить від значення кольору межі.outset
- Визначає зовнішню тримірну межу. Ефект залежить від значення кольору межі.none
- Не визначає межі.hidden
- Визначає приховану межу.
Властивість border-style
може мати від одного до чотирьох значень (для верхньої межі, правої межі, нижньої межі та лівої межі).
Приклад
Демонстрація різних стилів меж:
p.dotted {border-style: dotted;}
p.dashed {border-style: dashed;}
p.solid {border-style: solid;}
p.double {border-style: double;}
p.groove {border-style: groove;}
p.ridge {border-style: ridge;}
p.inset {border-style: inset;}
p.outset {border-style: outset;}
p.none {border-style: none;}
p.hidden {border-style: hidden;}
p.mix {border-style: dotted dashed solid double;}
Результат:
Крапкова межа.
Пунктирна межа.
Суцільна межа.
Подвійна межа.
Рифлена межа. Ефект залежить від значення кольору межі.
Ребриста межа. Ефект залежить від значення кольору межі.
Вставна межа. Ефект залежить від значення кольору межі.
Випукла межа. Ефект залежить від значення кольору межі.
Немає межі.
Змішана межа.
Примітка: Жодна з ІНШИХ властивостей межі CSS (про які ви дізнаєтесь більше в наступних розділах) не буде мати БУДЬ-ЯКОГО ефекту, якщо не встановлена властивість border-style
!