P4NISh3R
Comming soon...
مدیر بازنشسته
درود
به علّت اینکه از قبل مطالب رو اماده کردم برای همین قصد دارم روزی تو قسمت رو براتون بذارم تا زودتر و بهتر یاد بگیرد
[تصویر مورد نظر حذف شده است]:http://www.cssiran.ir/naw/happysmiley.gifبه علّت اینکه از قبل مطالب رو اماده کردم برای همین قصد دارم روزی تو قسمت رو براتون بذارم تا زودتر و بهتر یاد بگیرد
و اما آموزش:
در CSS همانطور که در جلسه ی اول آموختیم،میشود ویژگی ها و خصویات بسیار زیاد و زیبایی را به اشیا بخشید و کنترل بسیار بهتری برروی اشیا و عناصر درون صفحه داشت.اما برای مثال شما فرض کنید که ما کدی نوشته ایم که در آن ۵لایه div و چندین p و…. وجود دارد.برای مثال یکی از این p ها در یکی از این div هاست و ما مخواهیم کدی بنویسیم که بک گراند آن div خاکستری کم رنگ و همینطور رنگ آن p قرمز باشد.حالا ما برای نوشتن کد CSS آن چگونه باید به کد بفهمانیم که در بین این همه عنصر،آن ویژگی ها برای کدامیک تعریف شود؟
Class هاو ID ها چیستند؟
اگر طبق جلسه ی قبل از اسم عناصر استفاده کنیم این ویژگی ها برای تمامی div ها و p ها اجرا میشود.این چنین:
اگر طبق جلسه ی قبل از اسم عناصر استفاده کنیم این ویژگی ها برای تمامی div ها و p ها اجرا میشود.این چنین:
کد:
|
<style> p{color:#FF0000;} div{background:#ddd;} </style> |
در این حالت ما میتوانیم از CLASS ها و ID ها استفاده کنیم و یک کلاس جداگانه برای یک شی مخصوص نوشت.
یعنی کلاس ها و ای دی ها را برای دادن ویژگی های جدا به عناصر جداگانه تعریف میکنند.نحوه تعریف class و id : class ها :
در جلسه ی قبل آموختیم برای جداکردن Selector ها از . استفاده میشد.
در واقع این کار برای تعریف کلاس هاست.برای تعریف یک کلاس ابتدا علامت . و سپس اسم دلخواه و سپس علامت } و…. :
یعنی کلاس ها و ای دی ها را برای دادن ویژگی های جدا به عناصر جداگانه تعریف میکنند.نحوه تعریف class و id : class ها :
در جلسه ی قبل آموختیم برای جداکردن Selector ها از . استفاده میشد.
در واقع این کار برای تعریف کلاس هاست.برای تعریف یک کلاس ابتدا علامت . و سپس اسم دلخواه و سپس علامت } و…. :
کد:
| <style> .اسم{ویژگی ها} </style> |
برای فراخوانی CLASS ها یعنی به تگ بگوییم که فلان کلاس مخصوص توست باید از کد class استفاده کنیم.این چنین:
کد:
[TABLE="width: 1248"]
[TR]
[TD="class: gutter"][RIGHT]
[/RIGHT]
[/TD]
[TD="class: code"][SIZE=3][FONT=byekan]<div class=”اسم کلاس تعریف شده”>محتوا</div>[/FONT][/SIZE][/TD]
[/TR]
[/TABLE]مثال:
کد:
[RIGHT][COLOR=#333333]<html>[/COLOR]
[COLOR=#333333]<head>[/COLOR]
[COLOR=#333333]<style>[/COLOR]
[COLOR=#333333].matn{color:#FF0000}[/COLOR]
[COLOR=#333333]</style>[/COLOR]
[COLOR=#333333]</head>[/COLOR]
[COLOR=#333333]<body>[/COLOR]
[COLOR=#333333]<p class=”matn”>Persianbax.ir</p>[/COLOR]
[COLOR=#333333]</body>[/COLOR]
[COLOR=#333333]</html>[/COLOR][/RIGHT]id ها :
روش تعریف و فراخوانی id و class دو فرق با هم دارد و آن هم:
۱- در هنگام تعریف اسم کلاس در CSS به جای . از # استفاده میشود:
روش تعریف و فراخوانی id و class دو فرق با هم دارد و آن هم:
۱- در هنگام تعریف اسم کلاس در CSS به جای . از # استفاده میشود:
کد:
| <style> #اسم{ویژگی ها} </style> |
همینطور در هنگام فراخوانی به جای استفاده از کد class از کلمه ی id استفاده میشود:
[HTM]<p id=”اسن id”>محتوا</p>[/HTM]
فرق Class و ID :
تفوات مهم ID و CLASS در آن است که شما میتوانید یک class تعریف کنید و چندین بار آنرا فراخوانی کنید یعنی برای چندین تگ استفاده کنید:
اما این کار برای ID ها نمیشود.یعنی میتوان انجام داد و یک ID را برای چندین تگ فراخوانی کرد و درست هم کار میکند اما این کار یک عیب و اشکال در برنامه نویسی به حساب میاید و استاندارد نیست و رتبه و کیفیت کدنویسی قالب و کد را پایین می اورد.
[HTM]<p id=”اسن id”>محتوا</p>[/HTM]
فرق Class و ID :
تفوات مهم ID و CLASS در آن است که شما میتوانید یک class تعریف کنید و چندین بار آنرا فراخوانی کنید یعنی برای چندین تگ استفاده کنید:
کد:
[COLOR=#333333]<html>[/COLOR]
[COLOR=#333333]<head>[/COLOR]
[COLOR=#333333]<style>[/COLOR]
[COLOR=#333333].matn{color:#FF0000}[/COLOR]
[COLOR=#333333]</style>[/COLOR]
[COLOR=#333333]</head>[/COLOR]
[COLOR=#333333]<body>[/COLOR]
[COLOR=#333333]<p class=”matn”>Persianbax</p>[/COLOR]
[COLOR=#333333]<div class=”matn”>persianbax</p>[/COLOR]
[COLOR=#333333]</body>[/COLOR]
[COLOR=#333333]</html>[/COLOR]
آخرین ویرایش: