این آموزش در تاریخ ۱۴۰۲/۰۶/۲۶ آپدیت شده است.
آموزش نحوه استفاده از کلاس ها در CSS
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش نحوه استفاده از کلاس ها در CSS با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
نحوه استفاده از کلاس ها در CSS
برای ایجاد و استفاده از کلاس ها در زبان CSS خیلی راحت کافیه ۲ تا کارو انجام بدیم :
- استفاده از صفت Class درون تگ مورد نظرمون
- فراخوانی کلاس در CSS
- استفاده از صفت Class درون تگ مورد نظرمون
خیلی راحت کافیه از صفت Class درون اون تگی که میخوایم براش استایل تعریف کنیم استفاده نماییم.
|
1 |
<TagName class="MyClass"> |
- فراخوانی کلاس در CSS
برای فراخوانی کلاس در CSS خیلی راحت ، اول یه نقطه ( . ) میزاریم بعدش نام کلاس رو مینویسم. ( همین تموم شد رفت )
|
1 2 3 |
.MyClass { دستورات سی اس اس در اینجا } |
Free-Learn
مثال از ایجاد و استفاده کلاس ها در CSS
مثال شماره ۱ : تعریف و استفاده از کلاس در تگ های HTML
|
1 2 3 4 5 6 7 8 |
<style> .My-Class{ color:blue; text-align:center; } </style> |
مثال شماره ۲ : استفاده از چندین کلاس بصورت همزمان در چندین تگ
|
1 2 3 4 5 6 |
<body> <h2 class="mybg mycolor mycenter">سایت آموزشی فری لرن</h2> <p class="mybg mycolor mycenter">سایت آموزشی فری لرن</p> </body> |
مثال شماره ۳ : انتخاب فقط تگ های H2 که دارای کلاس بنام test می باشد
|
1 2 3 4 5 6 7 8 9 |
<style> h2.test{ background-color:orange; color:white; text-align:center; } </style> |
Free-Learn
نکات و توضیحات
- نام یک کلاس باید با حروف الفبای انگلیسی کوچک و یا بزرگ شروع شود.
- نام کلاس نباید با عدد شروع شود. ( مثه ۲۲test. )
- در تعریف نام یک کلاس میتوان از حروف کوچک و بزرگ انگلیسی ، اعداد و همچنین از علامت های – و _ استفاده کرد.
