Would you like to react to this message? Create an account in a few clicks or log in to continue.
Log in

I forgot my password

Latest topics
» کندن موی سر؛ بیماری ژنتیکی یا اختلالات روانی
استفاده از کلاس و id در طراحی صفحات با CSS EmptyFri Sep 18, 2009 6:50 am by tendownstreet

» نقش سویا در کاهش عوارض دوران یائسگی
استفاده از کلاس و id در طراحی صفحات با CSS EmptyFri Sep 18, 2009 6:48 am by tendownstreet

» قطع قاعدگی به هزار و یک علت
استفاده از کلاس و id در طراحی صفحات با CSS EmptyFri Sep 18, 2009 6:47 am by tendownstreet

» خانم ها باید مراقب باشند
استفاده از کلاس و id در طراحی صفحات با CSS EmptyFri Sep 18, 2009 6:47 am by tendownstreet

» آنچه زنان درباره ‌اش کمتر حرف‌ می ‌زنند
استفاده از کلاس و id در طراحی صفحات با CSS EmptyFri Sep 18, 2009 6:46 am by tendownstreet

» بهبود جوش با قرص ضدبارداری
استفاده از کلاس و id در طراحی صفحات با CSS EmptyFri Sep 18, 2009 6:45 am by tendownstreet

» عفونت های دستگاه ادراری زنان
استفاده از کلاس و id در طراحی صفحات با CSS EmptyFri Sep 18, 2009 6:45 am by tendownstreet

» بهبود کیفیت زندگی در زنان یائسه
استفاده از کلاس و id در طراحی صفحات با CSS EmptyFri Sep 18, 2009 6:44 am by tendownstreet

» هشت روش طلائی درمان دردهای پیش از قاعدگی
استفاده از کلاس و id در طراحی صفحات با CSS EmptyFri Sep 18, 2009 6:44 am by tendownstreet

لینک

برای تبادل لینک با مدیر سایت(salar)تماس بگیرید.

جک جک جکستانه ببم جان بیا وبخند

جدیدترین اخبار ورزشی

 

 

 

 

Statistics
We have 24 registered users
The newest registered user is quibernh

Our users have posted a total of 2246 messages in 615 subjects
تبلیغات
تبلیغ شما اینجا
برای تبلیغات با مدیر سایت(salar)تماس بگیرید.
Top posters
tendownstreet (1109)
استفاده از کلاس و id در طراحی صفحات با CSS Vote_lcapاستفاده از کلاس و id در طراحی صفحات با CSS Voting_barاستفاده از کلاس و id در طراحی صفحات با CSS Vote_rcap 
akbar (1100)
استفاده از کلاس و id در طراحی صفحات با CSS Vote_lcapاستفاده از کلاس و id در طراحی صفحات با CSS Voting_barاستفاده از کلاس و id در طراحی صفحات با CSS Vote_rcap 
sanaz (33)
استفاده از کلاس و id در طراحی صفحات با CSS Vote_lcapاستفاده از کلاس و id در طراحی صفحات با CSS Voting_barاستفاده از کلاس و id در طراحی صفحات با CSS Vote_rcap 
sima (2)
استفاده از کلاس و id در طراحی صفحات با CSS Vote_lcapاستفاده از کلاس و id در طراحی صفحات با CSS Voting_barاستفاده از کلاس و id در طراحی صفحات با CSS Vote_rcap 


استفاده از کلاس و id در طراحی صفحات با CSS

Go down

استفاده از کلاس و id در طراحی صفحات با CSS Empty استفاده از کلاس و id در طراحی صفحات با CSS

Post  akbar Tue Sep 08, 2009 5:03 am

سلکتور کلاس
با استفاده از کلاس می توانیم برای یک تگ HTML استایلهای متفاوتی را تعریف کنیم. برای نمونه فرض کنیم می خواهیم در صفحه دو نوع پاراگراف داشته باشیم: یکی با متن مشکی و دیگری با متن قرمز. برای مشخص کردن این دو نوع پاراگراف می توانیم از سلکتور کلاس استفاده کنیم. ابتدا استایل را به صورت زیر می نویسیم:
p.black {color: black}
p.red {color:red}
در مرحله بعد باید برای هر پاراگرافی که می خواهیم به رنگ مشکی باشد از شناسه "class="black در تگ <p> استفاده کنیم و برای پاراگراف قرمز از شناسه "class="red. البته نام کلاسها اختیاری است ولی بهتر است آنها را طوری انتخاب کنید که مفهوم داشته باشند تا وقتی که حجم استایل شما بیشتر شد به گنگ نباشد. در مثال زیر می توانید کد مربوط به نوشتن دو پاراگراف بالا را در متن HTML ملاحظه کنید:
<p class="black">این متنی است که به رنگ مشکی نمایش داده می شود</p>
<p class="red">این متن به رنگ قرمز نمایش داده می شود.</p>
نکته : شما می توانید بیش از یک کلاس برای یک تگ HTML تعریف کنید اما برای این کار نباید دو بار از شناسه class استفاده کرد. بلکه باید در یک شناسه class نام دو کلاس مورد نظر را با یک فاصله بین آنها وارد کرد. برای مثال برای پاراگراف زیر از دو کلاس فرضی red و center استفاده شده است:
<p class="red center">این متن پاراگرافی است که تحت تأثیر دو کلاس red و center قرار دارد</p>
در نوشتن استایل می توان از نوشتن نام تگ در سلکتور کلاس چشم پوشی کرد. در این صورت ویژگیهای تعریف شده در آن کلاس بر هر تگ HTML که از کلاس مربوطه در شناسه class آن استفاده شده باشد اثر می گذارد. برای مثال در کلاس زیر ویژگی وسط چین را تعریف می کنیم و از نام تگ در سلکتور کلاس استفاده نمی کنیم:
.center {text-align: center}
اکنون برای هر تگی که احتیاج به وسط چین داشته باشد می توانیم از کلاس بالا استفاده کنیم. به چند نمونه در زیر توجه کنید:
<p class="center">متن این پاراگراف به صورت وسط چین نمایش داده می شود</p>
<div class="center">متن این قسمت به صورت وسط چین نمایش داده می شود</div>
<h2 class="center">متن این سرفصل به صورت وسط چین نمایش داده می شود</h2>
تذکر : هیچ وقت نام کلاس را با یک عدد شروع نکنید چون در این صورت مرورگرهای Mozilla و Firefox نمی توانند از آن کلاس استفاده کنند.
ما می توانیم از سلکتور کلاس برای تگی که حاوی شناسه class است استفاده کنیم که در قسمتهای قبلی در این مورد توضیح داده شد. علاوه بر این می توانیم از ویژگیهای تعریف شده در سلکتور کلاس برای تگهایی که در یک تگ محتوی شناسه class قرار دارند نیز استفاده کنیم. مثلا برای لینکهایی که در یک DIV قرار دارند و برای DIV کلاس تعریف شده است. برای این کار در نوشتن استایل مربوطه باید پس از نقطه که مشخص کننده سلکتور کلاس است نام کلاس را وارد کنیم و پس از وارد کردن یک فضای خالی نام تگی که می خواهیم ویژگیهای بر روی آن اعمال شود. به مثال زیر توجه کنید:
در این مثال از استایل زیر در استفاده می کنیم:
.test { border: #F00 1px double }
.test a { color: green }
.test a:hover { border: yellow 2px solid }
کد HTML زیر برای این مثال مورد استفاده قرار می گیرد:
<div class="test">
<a href="#">لینک آزمایشی شماره 1</a>
</div>
<a href="#">لینک آزمایشی شماره 2</
akbar
akbar
مدیریت کـــــــــل سایت
مدیریت کـــــــــل سایت

تعداد پستها : 1100
امتیاز : 1980
تشکرشده : 0
تاریخ عضویت : 2009-08-20
سن : 28

http://jok09.blogfa.com

Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum