From 074785cea106179cb3305637055ab0a009ca74f2 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:42:52 -0500 Subject: initial commit --- files/ru/web/css/border/index.html | 118 +++++++++++++++++++++++++++++++++++++ 1 file changed, 118 insertions(+) create mode 100644 files/ru/web/css/border/index.html (limited to 'files/ru/web/css/border/index.html') diff --git a/files/ru/web/css/border/index.html b/files/ru/web/css/border/index.html new file mode 100644 index 0000000000..9f116b5eda --- /dev/null +++ b/files/ru/web/css/border/index.html @@ -0,0 +1,118 @@ +--- +title: border +slug: Web/CSS/border +tags: + - CSS Границы + - CSS свойства + - Разметка + - СовместимостьМобильныхБраузеров + - Справка +translation_of: Web/CSS/border +--- +
{{CSSRef("CSS Borders")}}
+ +

Свойство CSS border это  универсальное свойство для указания всех персональных свойств границ за раз: {{Cssxref("border-width")}}, {{Cssxref("border-style")}}, и {{Cssxref("border-color")}}.

+ +
{{EmbedInteractiveExample("pages/css/border.html")}}
+ +

Как и во всех универсальных свойствах, любое персональное значение, которое не указанно, устанавливается в начальное занчение. Обратите внимание, border не может быть использован для указания пользовательского значения {{cssxref("border-image")}}, но вместо этого устанавливает его в начальное значение, т.е. none.

+ +
border: 1px;
+border: 2px dotted;
+border: medium dashed green;
+
+ +

 

+ +
+

Замечание: Рекомендуется использовать border, когда вы хотите установить все свойства границ одновременно. Тогда как универсальные свойства {{Cssxref("border-width")}}, {{Cssxref("border-style")}}, и {{Cssxref("border-color")}}  принимают до четырех значений, позволяя установить различные значения для каждого ребра, border принимает единственное значение для каждого свойства. И этот стиль применяется для всех четырех границ.

+
+ +

Синтаксис

+ +

Свойство border  указывается используя одно или более значений <br-width>, <br-style>, и <color> указанных ниже.

+ +

Значения

+ +
+
<br-width>
+
Толщина границ. По умолчанию medium если отсутствует. Больше информации {{Cssxref("border-width")}}.
+
<br-style>
+
Стиль линии границ. По умолчанию none если отсутствует. Больше информации {{Cssxref("border-style")}}.
+
{{cssxref("<color>")}}
+
Цвет границ. По умолчанию принимает значение свойства элементов {{cssxref("color")}}. Больше информации {{Cssxref("border-color")}}.
+
+ +

Обычный синтаксис

+ +
{{csssyntax}}
+ +

Примеры

+ +

HTML

+ +
<div class="fun-border">Look at my borders.</div>
+<p>Вы можете редактировать CSS ниже для экспериментов со стилями границ!</p>
+<style contenteditable>
+  .fun-border {
+    border: 2px solid red;
+  }
+</style>
+
+ +

CSS

+ +
style {
+  display: block;
+  border: 1px dashed black;
+}
+ +

Результат

+ +

{{EmbedLiveSample('Examples')}}

+ +

Спецификация

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('CSS3 Backgrounds', '#the-border-shorthands', 'border')}}{{Spec2('CSS3 Backgrounds')}}Убирает  особую поддержку для transparent, так как сейчас принимается как значение {{cssxref("<color>")}}; это не имеет практического воздействия.
+ Хотя нельзя установить пользовательское значение через универсальное свойство, border сейчас сбрасывает {{cssxref("border-image")}} до начального значения (none).
{{SpecName('CSS2.1', 'box.html#border-shorthand-properties', 'border')}}{{Spec2('CSS2.1')}}Принимает ключевое слово inherit. Так же принимает transparent как действующий цвет.
{{SpecName('CSS1', '#border', 'border')}}{{Spec2('CSS1')}}Начальное определение.
+ +

{{cssinfo}}

+ +

Совместимость браузеров

+ +
+
+

{{Compat("css.properties.border")}}

+
+
+ +

Также смотрите

+ + -- cgit v1.2.3-54-g00ecf