خانه / سی اس اس CSS / انتخاب گر شناسه ( id selector ) در CSS

انتخاب گر شناسه ( id selector ) در CSS

انتخاب گر شناسه ( id selector ) در CSS

 

id selector از خصیصه ی شناسه ( HTML )id attribute برای انتخاب یک المان معین بهره می گیرد . یک شناسه داخل صفحه باید منحصر بفرد باشد، بنابراین انتخاب گر شناسه زمانی بکار گرفته می شود که بخواهید یک عنصر تک و منحصر بفرد را انتخاب کنید . جهت انتخاب یک المان با شناسه ی ویژه (مشخص،) باید یک کاراکتر # hash را تایپ کرده و بدنبال این کاراکتر شناسه ی المان را قرار دهید . قانون سبک دهی style rule زیر با شناسه ی para1 به المان HTML اضافه می شوند :

#para1 {
text-align: center;

color: red;
}

توجه هیچگاه اسم شناسه ID name را با یک عدد آغاز نکنید .

 

انتخاب گر شناسه ( id selector ) در CSS
انتخاب گر شناسه ( id selector ) در CSS

انتخاب گر کلاس class selector :

انتخاب گر کلاس المان ها را با یک خصیصه ی کلاس / class attribute ویژه آغاز می کند . به منظور انتخاب المان ها با کلاسی معین، یک کاراکتر نقطه و به دنبال آن اسم کلاس را تایپ کنید در مثال زیر، کلیه ی عناصر HTML با کلاس center وسط چین align- center خواهند بود :

.center {
text-align: center;
color: red;
}

همچنین می توان مشخص کرد که تنها عناصر خاصی از HTML دست خوش تغییر یک کلاس معین قرار گیرند (به عبارتی دیگر می توانید تعیین کنید که فقط المان های مدنظر شما توسط یک کلاس کنترل شده و تحت تاثیر آن قرار گیرند) در مثالی که زیر ارائه شده، تمامی المان های  <p> با کلاس center وسط چین align- center می شوند.

p.center {
text-align: center;
color: red;

}

توجه از آغاز کردن اسم کلاس با عدد اکیدا خودداری کنید .

 

 

ادغام گروه ها / گروه بندی انتخاب گرها grouping selectors :

چنانچه المان هایی با تعاریف سبک style definition مشابه به مثال ذیل دارید، در آن صورت می توانید با گروه بندی کدها آنها را سامان دهی کرده و در عین حال اندازه ی کدهای ذکر شده را به حداقل برساند.

h1 {
text-align: center;
color: red;
}
h2 {
text-align: center;
color: red;
}
p {
text-align: center;
color: red;
}

CSS-Thumbnail
CSS-Thumbnail

برای این منظور کافی است انتخاب گرها را با استفاده از ویرگول از هم جدا ساخت . نمونه ی زیر در حقیقت همان تکه کد فوق است که در آن سه گروه مزبور با هم در یک گروه ادغام شده اند و هر گروه با بهره گیری از ویرگول از گروه دیگر متمایز شده است :

h1,h2,p{
text-align: center;
color: red;
}

در ادامه با ما باشید مطالب جالبی برای شما دوستان عزیز در راه داریم…. در صورت تمایل مطالب ما را به اشتراک بگذارید تا دوستانتان بهره کافی را ببرند……

 

 

 

همچنین بررسی کنید

images

طریقه صحیح لینک link گذاری چیست ؟

آموزش Link   می توان لینک ها را به شیوه های مختلف سبک دهی (بندی) …

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

%u0637%u0631%u0627%u062D%u06CC %u0633%u0627%u06CC%u062A
طراحی سایتسئواجاره ویلا و فروش ویلا شمالسرویس و تعمیر کولر گازیاجاره ویلافروش ویلااجاره ویلافروش ویلاویلا شمالویلا زیباکنار