021-20483015

صفت class در HTML

استفاده از صفت class

صفت class در HTML این امکان را فراهم می آورد تا برای چندین عنصر که به نام class یکسانی اشاره می کنند ، استایل یکسانی تعریف کنیم. در زیر 3 عنصر <div> داریم که به یک نام class اشاره می کند :

مثال :

کلاس عناصر
<!DOCTYPE html>
<html>
<head>
<style>
div.cities {
    background-color: black;
    color: white;
    margin: 20px 0 20px 0;
    padding: 20px;
    direction: rtl;
}
</style>
</head>

<body>

<div class="cities">
<h2>لندن</h2>
<p>لندن پایتخت انگلستان و پر جمعیت ترین شهر این کشور است و دارای منطقه شهری با بیش از 13 میلیون از جمعیت می باشد</p>
</div> 

<div class="cities">
<h2>پاریس</h2>
<p>پاریس پایتخت فرانسه و پرجمعیت ترین شهر فرانسه است.</p>
</div>

<div class="cities">
<h2>توکیو</h2>
<p>توکیو پایتخت ژاپن ، مرکز ناحیه بزرگ توکیو و پرجمعیت ترین منطقه شهری در جهان است.</p>
</div>

</body>
</html>
مشاهده مثال


استفاده از صفت class در عناصر اینلاین

می توان از صفت class در HTML برای عناصر اینلاین نیز استفاده کرد.

مثال :

کلاس در عناصر اینلاین
<!DOCTYPE html>
<html>
<head>
<style>
span.note {
    font-size: 120%;
    color: red;
}
</style>
</head>
<body>

<h1 dir="rtl">تیتر <span class="note">مهم</span> من</h1>
<p dir="rtl">این هم یک متن  <span class="note">مهم</span>  است.</p>

</body>
</html>
مشاهده مثال
 

نظر شما

لطفا نام و نام خانوادگی خود را وارد کنید
لطفا ایمیل خود را وارد کنید لطفا ایمیل صحیح وارد کنید.
لطفا متن نظر خود را وارد کنید
>

مقالات و دروس

به خبرنامه مدرسه طراحی وب ایران (وب مهراز) بپیوندید.

لطفا شماره همراه صحیح وارد کنید.
لطفا ایمیل صحیح وارد کنید.

مقالات مرتبط