استخدام سمة الفئة class في HTML | دروس HTML5


سمة الفئة في HTML

باستخدام سمة class في HTML، يمكنك تحديد نمط مكافئ لجميع العناصر التي لها نفس اسم الفئة. في هذا الدرس، سوف نعرف فئة الصفات.


استخدم سمة الفئة

باستخدام سمة class في HTML ، يمكنك تحديد نمط مكافئ لجميع العناصر التي لها نفس اسم الفئة.

في مثال الكود أدناه، هناك ثلاثة عناصر <div> ، وكلها لها نفس اسم الفئة.

<!DOCTYPE html>
<html>
<head>
<style>
div.cities {
background-color: black;
color: white;
margin: 20px 0 20px 0;
padding: 20px;
}
</style>
</head>
<body>

<div class="cities">
<h2>London</h2>
<p>London is the capital of England.
It is the most populous city in the United Kingdom,
with a metropolitan area of over 13 million inhabitants.</p>
</div>

<div class="cities">
<h2>Paris</h2>
<p>Paris is the capital and most populous city of France.</p>
</div>

<div class="cities">
<h2>Tokyo</h2>
<p>Tokyo is the capital of Japan, the center of the Greater Tokyo Area,
and the most populous metropolitan area in the world.</p>
</div>
</body>
</html>

استخدم سمة الفئة في العناصر المضمنة

يمكن أيضًا استخدام سمة class للعناصر المضمنة:

<!DOCTYPE html>
<html>
<head>
<style>
span.note {
font-size: 120%;
color: red;
}
</style>
</head>
<body>

<h1>My <span class="note">Important</span> Heading</h1>
<p>This is some <span class="note">important</span> text.</p>

</body>
</html>
 

كلمات مفتاحية: