-
پایان فعالیت بخشهای انجمن: امکان ایجاد موضوع یا نوشته جدید برای عموم کاربران غیرفعال شده است
فرق ID و CLASS
- شروع کننده موضوع yehnafar
- تاریخ شروع
aaber_piade
Registered User
توي استايل ام تي با id كار شده، فكر نمي كنم زياد فرقي بكنه احسان طرفدار class هست .. 
amirnezhad
کاربر تازه وارد
- تاریخ عضویت
- 26 جولای 2003
- نوشته‌ها
- 136
- لایک‌ها
- 0
سلام
من اصلا نميدونم چطوري ميشه از ID توي CSS استفاده كرد! :shock:
تا حالا من هميشه از CLASS استفاده مي كردم و از ID فقط براي كار كردن توي DOM: Document Object Model استفاده كردم!!!
ميشه لطف كني و يه نمونه SOURCE كه توش از ID براي كار با CSS استفاده شده رو بگي تا ما هم يه چيزي ياد بگيريم!
ممنون
من اصلا نميدونم چطوري ميشه از ID توي CSS استفاده كرد! :shock:
تا حالا من هميشه از CLASS استفاده مي كردم و از ID فقط براي كار كردن توي DOM: Document Object Model استفاده كردم!!!
ميشه لطف كني و يه نمونه SOURCE كه توش از ID براي كار با CSS استفاده شده رو بگي تا ما هم يه چيزي ياد بگيريم!
ممنون
aaber_piade
Registered User
سلام
من اصلا نميدونم چطوري ميشه از ID توي CSS استفاده كرد! :shock:
تا حالا من هميشه از CLASS استفاده مي كردم و از ID فقط براي كار كردن توي DOM: Document Object Model استفاده كردم!!!
ميشه لطف كني و يه نمونه SOURCE كه توش از ID براي كار با CSS استفاده شده رو بگي تا ما هم يه چيزي ياد بگيريم!
ممنون
css هودر رو ببينيد و يا stylesheet قالب هاي ام تي رو نگاه بندازين
amirnezhad
کاربر تازه وارد
- تاریخ عضویت
- 26 جولای 2003
- نوشته‌ها
- 136
- لایک‌ها
- 0
مجددا سلام!
اين موضوعي بود كه من تا به حال بهش بر نخورده بودم و يا اينكه بهش توجه نكرده بودم! ولي خوب بالاخره اتفاقي افتاد كه برم دنبالش ...
من خودم دقيق نميدونم ولي چند جا توي وب پيدا كردم (مثل: <a href='http://codepunk.hardwar.org.uk/acss06.htm' target='_blank'>http://codepunk.hardwar.org.uk/acss06.htm</a>) كه در اين مورد مطالبي داشتن و خوب تقريبا همه با هم در مورد تفاوت CLASS و ID يه چيز گفته بودن. اونهم اينكه:
كلاس در واقع خصوصيات نمايشي مربوط به CSS يكسري از اجزاي صفحه (Tagها) است كه همه با هم يكسان هستند ولي بايد در اين مورد به اين اشاره كرد كه در يك صفحه مي توان تعداد نامحدودي از Tagها را با يك كلاس يكسان قرار داد. اما در مورد ID تفاوت مهم و در واقع مهمترين تفاوت آن است كه شما تنها يكبار مجاز به استفاده از هر ID در هر صفحه مي باشيد و در برخي موارد استفاده از دو Tag با يك ID يكسان حتي مي تواند باعث ايجاد اشكال (ERROR) در صفحه شود.
به عبارت ديگر مورد:
[code:1]
<div class="someClass"></div>
<p class="someClass"></p>
[/code:1]
كاملا صحيح بوده و شما مجاز به استفاده آن در صفحات خود مي باشيد و مورد:
[code:1]
<div id="someID"></div>
<p id="someID"></p>
[/code:1]
مجاز نمي باشد و در برخي موارد باعث ايجاد خطا نيز خواهد شد.
ببخشيد كه اينقدر رسمي نوشتم.
فعلا
اين موضوعي بود كه من تا به حال بهش بر نخورده بودم و يا اينكه بهش توجه نكرده بودم! ولي خوب بالاخره اتفاقي افتاد كه برم دنبالش ...
من خودم دقيق نميدونم ولي چند جا توي وب پيدا كردم (مثل: <a href='http://codepunk.hardwar.org.uk/acss06.htm' target='_blank'>http://codepunk.hardwar.org.uk/acss06.htm</a>) كه در اين مورد مطالبي داشتن و خوب تقريبا همه با هم در مورد تفاوت CLASS و ID يه چيز گفته بودن. اونهم اينكه:
كلاس در واقع خصوصيات نمايشي مربوط به CSS يكسري از اجزاي صفحه (Tagها) است كه همه با هم يكسان هستند ولي بايد در اين مورد به اين اشاره كرد كه در يك صفحه مي توان تعداد نامحدودي از Tagها را با يك كلاس يكسان قرار داد. اما در مورد ID تفاوت مهم و در واقع مهمترين تفاوت آن است كه شما تنها يكبار مجاز به استفاده از هر ID در هر صفحه مي باشيد و در برخي موارد استفاده از دو Tag با يك ID يكسان حتي مي تواند باعث ايجاد اشكال (ERROR) در صفحه شود.
به عبارت ديگر مورد:
[code:1]
<div class="someClass"></div>
<p class="someClass"></p>
[/code:1]
كاملا صحيح بوده و شما مجاز به استفاده آن در صفحات خود مي باشيد و مورد:
[code:1]
<div id="someID"></div>
<p id="someID"></p>
[/code:1]
مجاز نمي باشد و در برخي موارد باعث ايجاد خطا نيز خواهد شد.
ببخشيد كه اينقدر رسمي نوشتم.
فعلا
amirnezhad
کاربر تازه وارد
- تاریخ عضویت
- 26 جولای 2003
- نوشته‌ها
- 136
- لایک‌ها
- 0
ببخشيد دوباره سلام
براي اون دسته از دوستان كه مثل من نمي دونستن چطوري ميشه از ID براي CSS استفاده كرد چند تا مثال داشتم كه فكر مي كنم به دردشون بخوره!
1) تعريف Class:
[code:1]
.someClass {
background-color: white;
margin: 0px;
}
[/code:1]
2) تعريف ID:
[code:1]
#someID {
background-color: white;
margin: 0px;
}
[/code:1]
3) استفاده از Class:
[code:1]
<div class="someClass"></div>
[/code:1]
4) استفاده از ID:
[code:1]
<div id="someID"></div>
[/code:1]
5) استفاده از Class و ID بطور همزمان:
[code:1]
<div id="someID" class="someClass"></div>
[/code:1]
بازهم قربان همگي ...
براي اون دسته از دوستان كه مثل من نمي دونستن چطوري ميشه از ID براي CSS استفاده كرد چند تا مثال داشتم كه فكر مي كنم به دردشون بخوره!
1) تعريف Class:
[code:1]
.someClass {
background-color: white;
margin: 0px;
}
[/code:1]
2) تعريف ID:
[code:1]
#someID {
background-color: white;
margin: 0px;
}
[/code:1]
3) استفاده از Class:
[code:1]
<div class="someClass"></div>
[/code:1]
4) استفاده از ID:
[code:1]
<div id="someID"></div>
[/code:1]
5) استفاده از Class و ID بطور همزمان:
[code:1]
<div id="someID" class="someClass"></div>
[/code:1]
بازهم قربان همگي ...
amirnezhad
کاربر تازه وارد
- تاریخ عضویت
- 26 جولای 2003
- نوشته‌ها
- 136
- لایک‌ها
- 0
اولا خواهش مي كنم.
دوما همونطوري كه قبلا نوشتم استفاده از دو TAG با ID يكسان فقط بعضي مواقع مي تونه باعث ايجاد خطا بشه. به اين مورد توجه كن:
اين Source رو توي يك فايل HTML بريز و امتحانش كن!!!
[code:1]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<style type="text/css">
<!--
#someID {
background-color: blue;
margin: 0px;
}
-->
</style>
</head>
<body>
<center>
<div id="someID">someID</div>
<br><br>
<input type="button" value="Change Background Color!" onclick="someID.style.backgroundColor='green';">
</center>
</body>
</html>
[/code:1]
ديدي كه مشكلي پيش نيومد و با زدن كليد، رنگ زمينه هم عوض شد.
حالا اين مورد رو ببين.
باز هم اين Source رو بريز تو يه فايل HTML
[code:1]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<style type="text/css">
<!--
#someID {
background-color: blue;
margin: 0px;
}
-->
</style>
</head>
<body>
<center>
<div id="someID">someID 1</div>
<br>
<div id="someID">someID 2</div>
<br><br>
<input type="button" value="Change Background Color!" onclick="someID.style.backgroundColor='green';">
</center>
</body>
</html>
[/code:1]
در اين مورد بسته به BROWSER اتفاقات مختلفي مي افته فقط اينكه در هيچ حالتي (حداقل براي من كه با 7 تا BROWSER مختلف امتحان كردم!) صفحه درست كار نمي كنه!
قربانت و باز هم از تعارفت ممنون
در اين مورد بسته به BROWSER اتفاقات مختلفي مي افته فقط اينكه در هيچ حالتي (حداقل براي من كه با 7 تا BROWSER مختلف امتحان كردم!) صفحه درست كار نمي كنه!
قربانت و باز هم از تعارفت ممنون
ميشه اون 7 تا رو نام ببري؟
:mrgreen: راستي اين سايتي كه معرفي كردي خيلي جالب بود. فقط توش من دنبال تفاوت span و div هم بود که نمی دونم چرا پیدا نکردم....
این قضیه هم نمیشه که آخه یه جا eror بده یه جا نده. این خیلی عجیبه... البته تفاوت بین browser ها هم ممکنه علت باشه....
ببين گمان نكنم اين اشكالي كه در حالت دوم مي ده به خاطر تكرار id باشه... گمانم این یه ذره مشکوک می زنه :
[code:1]onclick="someID.style.backgroundColor='green';"[/code:1]
اینو کسی هست که بیشتر از من سرش بشه...
من تو تکرار ID مشکلی نمی بینم هنوز ( البته هنوز!)
[code:1]onclick="someID.style.backgroundColor='green';"[/code:1]
اینو کسی هست که بیشتر از من سرش بشه...
من تو تکرار ID مشکلی نمی بینم هنوز ( البته هنوز!)
amirnezhad
کاربر تازه وارد
- تاریخ عضویت
- 26 جولای 2003
- نوشته‌ها
- 136
- لایک‌ها
- 0
[left:93925e3db8]ميشه اون 7 تا رو نام ببري؟
1) Internet Explorer 4 (WINDOWS)
2) Internet Explorer 5.5 (WINDOWS)
3) Internet Explorer 6.0 (WINDOWS)
4) Netscape 6.4 (LINUX)
5) Netscape 7 (WINDOWS)
6) Opera 6 (WINDOWS)
7) Mozila (LINUX)
[/left:93925e3db8]
كه البته موارد توي پرانتز سيستم عاملي بود كه BROWSER روش نصب شده!
ببين در همه موارد كاري كه ما مي خواهيم انجام نميشه ولي در بعضي از موارد پيغام خطا نمايش داده ميشه و در بعصي موارد نه! و تفاوتهاي BROWSER ها هم (همونطوري كه خودت گفتي) علت اصلي اين موضوع است!
amirnezhad
کاربر تازه وارد
- تاریخ عضویت
- 26 جولای 2003
- نوشته‌ها
- 136
- لایک‌ها
- 0
ببين گمان نكنم اين اشكالي كه در حالت دوم مي ده به خاطر تكرار id باشه... گمانم این یه ذره مشکوک می زنه :
[code:1]onclick="someID.style.backgroundColor='green';"[/code:1]
اینو کسی هست که بیشتر از من سرش بشه...
من تو تکرار ID مشکلی نمی بینم هنوز ( البته هنوز!)
سلام
يك نكته! با امتحان كردن اين موضوع در مورد كلاس ميشه به يك نتيجه ديگه هم رسيد. اونهم اينكه وقتي به يك TAG يك ID اختصاص داده ميشه اون TAG به يك Object (توي بحث DOM: Document Object Model) تبديل مي شه و ميشه بصورت Dynamic توي صفحه خصوصياتش رو تغيير داد (مثل Source اولي) ولي در مورد Class اين اتفاق نمي افته!
اون فانكشن OnClick هم كه تو بهش اشره كردي همين مورد رو تاييد ميكنه و دستور بعدش هم به همون بحث DOM مربوط ميشه. و در واقع همين خاصيت هم باعث ايجاد ERROR مي شه چون وقتي دو تا TAG يك ID داشته باشن در واقع دو تا Object با اسم مشابه توي صفحه ايجاد ميشه كه اين منبع اصلي ايجاد اون ERROR است.
ببخشيد كه يكم گنگ شد. ولي فكر كنم كه بتوني منظورم رو بفهمي!
ببین من دارم گیج می شم، یه نگاهی به سورس هودر بیانداز که به طرز خفنی از id استفاده کرده و تو خیلی جا ها هم یه id و تکرار کرده. گمان نکنم صفحه هودر مشکلی داشته باشه.
مثلا تو یه جا اومده:
[code:1]<DIV id=left-box-mid>
<DIV id=left-cell-hdr>سال پيش، همين‌جا</DIV>
<DIV id=left-cell style="DIRECTION: ltr">
<DIV dir=rtl><A title="What is Individualism?"
href="http://i.hoder.com/archives/2002/08/020814_004493.shtml">•
مرتضی مرديها، از درس‌های فرهنگ جهانی: « يکی از زيباترين... </A></DIV>[/code:1]
و پایین ترش :
[code:1]
<DIV id=left-box-mid>
<DIV id=left-cell-hdr>دوستان و آشنايان</DIV>
<DIV id=left-cell style="DIRECTION: ltr">
<DIV
style="MARGIN-TOP: 0px; MARGIN-BOTTOM: 10px; DIRECTION: rtl; TEXT-ALIGN: left"><A
style="FONT-SIZE: 80%; COLOR: #333"
href="http://anon.free.anonymizer.com/http://newhome.weblogs.com/pingSiteForm">-
فرم اعلام به‌روزشدن وب‌لاگ</A> </DIV>[/code:1]
میبی که id=left-cell دو بار اومده...
مثلا تو یه جا اومده:
[code:1]<DIV id=left-box-mid>
<DIV id=left-cell-hdr>سال پيش، همين‌جا</DIV>
<DIV id=left-cell style="DIRECTION: ltr">
<DIV dir=rtl><A title="What is Individualism?"
href="http://i.hoder.com/archives/2002/08/020814_004493.shtml">•
مرتضی مرديها، از درس‌های فرهنگ جهانی: « يکی از زيباترين... </A></DIV>[/code:1]
و پایین ترش :
[code:1]
<DIV id=left-box-mid>
<DIV id=left-cell-hdr>دوستان و آشنايان</DIV>
<DIV id=left-cell style="DIRECTION: ltr">
<DIV
style="MARGIN-TOP: 0px; MARGIN-BOTTOM: 10px; DIRECTION: rtl; TEXT-ALIGN: left"><A
style="FONT-SIZE: 80%; COLOR: #333"
href="http://anon.free.anonymizer.com/http://newhome.weblogs.com/pingSiteForm">-
فرم اعلام به‌روزشدن وب‌لاگ</A> </DIV>[/code:1]
میبی که id=left-cell دو بار اومده...
amirnezhad
کاربر تازه وارد
- تاریخ عضویت
- 26 جولای 2003
- نوشته‌ها
- 136
- لایک‌ها
- 0
ببين تا جايي كه من ميدونم اين حالت وقتي پيش مياد كه شما بخواهي از امكانات مربوط به بحث DOM توي صفخه ها استفاده كني و اگه نخواهي اين كار رو بكني فكر نمي كنم اشكالي بوجود بياد (البته تحت ويندوز، چون Netscape 6.4 تحت لينوكس اگه يك صفحه با دوتا Object هم نام رو توش ببيني همون اولش پيغام خطا ميده!) و فكر مي كنم تفاوت اصلي همون تفاوتي باشه كه توي پيغام قبلي گفتم (پشتيباني از DOM) و همون هم باعث ميشه كه تفاوتي كه اول بحث گفتم بوجود بياد.
amirnezhad
کاربر تازه وارد
- تاریخ عضویت
- 26 جولای 2003
- نوشته‌ها
- 136
- لایک‌ها
- 0
خوب اين كه مشخصا بر مي گرده به بحث DOM