fix: converted single to triple backticks8 (#36235)

This commit is contained in:
Randell Dawson
2019-06-20 13:45:47 -07:00
committed by Tom
parent 54d303ce1f
commit 8f67cfa4d6
75 changed files with 1225 additions and 1125 deletions

View File

@@ -8,18 +8,19 @@ localeTitle: فئات CSS
عند كتابة HTML ، يمكنك إضافة فئات إلى عنصر. ما عليك سوى إضافة `class="myclass"` السمات `class="myclass"` إلى العنصر. يمكن أن تحتوي العناصر المتعددة على نفس الفئة ، ويمكن لعنصر واحد أن يحتوي على فئات متعددة. يمكنك تعيين فئات متعددة لعنصر عن طريق إضافة كل أسماء الفئات المطلوبة المفصولة بمسافة إلى سمة `class` في HTML.
`
<h1 class="super-man other-class third-class">"Here I come to save the day!"</h1>
<p>is a popular catchphrase that <span class="super-man">Super Man</span> often said.</p>
`
```html
<h1 class="super-man other-class third-class">"Here I come to save the day!"</h1>
<p>is a popular catchphrase that <span class="super-man">Super Man</span> often said.</p>
```
يمكنك بعد ذلك تصميم هذه العناصر باستخدام CSS. تتم الإشارة إلى الفئات بالنقطة (.) قبلها في CSS ، ولكن لا يجب وضع الفترات في HTML الخاص بك.
`.super-man {
color: red;
background-color: blue;
}
`
```css
.super-man {
color: red;
background-color: blue;
}
```
يعطي هذا الرمز خلفية زرقاء ولون نص أحمر لكافة العناصر التي تحتوي على فئة `super-man` . [شاهد هذا المثال على CodePen](https://codepen.io/Tlandis/pen/RLvomV) .
@@ -33,24 +34,26 @@ localeTitle: فئات CSS
ثم في ملف css الخاص بك:
`.ironMan{
color:red;
}
.alfred{
background-color: black;
}
`
```css
.ironMan{
color:red;
}
.alfred{
background-color: black;
}
```
**ملاحظة:** أسماء الصفوف عادةً ما تكون جميع الأحرف الصغيرة ، مع كل كلمة في اسم فئة متعدد الكلمات مفصولة بواصلات (على سبيل المثال "super-man").
يمكنك أيضًا الجمع بين الصفوف في نفس السطر:
`.superMan .spiderMan {
color: red;
background-color: blue;
}
`
```css
.superMan .spiderMan {
color: red;
background-color: blue;
}
```
يمكنك رؤية نتيجة الكود أعلاه [هنا](https://codepen.io/Tlandis/pen/RLvomV) . تعرف على كيفية الجمع بين دروس css باستخدام المحددات [هنا](https://www.w3schools.com/css/css_combinators.asp) .