From 4b1a9203c547c019fc5398082ae19a3f3d4c3efe Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:41:15 -0500 Subject: initial commit --- files/bg/web/css/_colon_first-child/index.html | 117 +++++++++++++++++++++++++ 1 file changed, 117 insertions(+) create mode 100644 files/bg/web/css/_colon_first-child/index.html (limited to 'files/bg/web/css/_colon_first-child/index.html') diff --git a/files/bg/web/css/_colon_first-child/index.html b/files/bg/web/css/_colon_first-child/index.html new file mode 100644 index 0000000000..799ab091ba --- /dev/null +++ b/files/bg/web/css/_colon_first-child/index.html @@ -0,0 +1,117 @@ +--- +title: ':first-child' +slug: 'Web/CSS/:first-child' +tags: + - CSS + - Оформление + - Псевдоклас + - справочник +translation_of: 'Web/CSS/:first-child' +--- +
{{CSSRef}}
+ +

CSS псевдокласът :first-child (:първо-дете) указва всеки елемент, намиращ се на първо място в списък с елементи от едно и също ниво в структурата на документа. В имплементациите на CSS3, за да бъде селектиран елемента, той трябва да има родител. В CSS4 това не е нужно.

+ +

Правопис

+ +
{{csssyntax}}
+
+ +

Примери

+ +

Пример 1

+ +

HTML

+ +
<div>
+  <p>This p is styled, as it is a p, AND the first
+     child in the div</p>
+  <p>This p is not styled; it is not the first child!</p>
+</div>
+
+<div>
+  <h2>This h2 is not styled; it is not a p!</h2>
+  <p>This p is not styled; it is not the first child!</p>
+</div>
+
+ +

CSS

+ +
p:first-child {
+  color: lime;
+  background-color: black;
+  padding: 5px;
+}
+
+ +

Резултат

+ +

{{EmbedLiveSample('Пример_1','100%',300)}}

+ +

Пример 2 - с използване на UL

+ +

HTML

+ +
<ul>
+  <li>List 1</li>
+  <li>List 2</li>
+  <li>List 3</li>
+</ul>
+ +

CSS

+ +
li{
+  color:blue;
+}
+li:first-child{
+  color:green;
+}
+ +

Резултат

+ +

{{EmbedLiveSample('Пример_2_-_с_използване_на_UL',300,100)}}

+ +

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

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('CSS4 Selectors', '#first-child-pseudo', ':first-child')}}{{Spec2('CSS4 Selectors')}}Елементите няма нужда да имат родител за да бъдат селектирани.
{{SpecName('CSS3 Selectors', '#first-child-pseudo', ':first-child')}}{{Spec2('CSS3 Selectors')}}Без промяна.
{{SpecName('CSS2.1', 'selector.html#first-child', ':first-child')}}{{Spec2('CSS2.1')}}Начална дефиниция.
+ +

Съвместимост на четците

+ + + +

{{Compat("css.selectors.first-child")}}

+ +

Вижте също

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