مباحث اولیه برای آشنایی با CSS

P O U R I A · Jul 28, 2015

فهرست مطالب:

شروع یادگیری CSS
شیوه های به کار بردن کدهای CSS
تعیین رنگ فونت ها با مشخصه color در CSS
مشخصه class برای کلاس بندی بخش های مورد نظرمان برای اجرای کد CSS
مشخصه id برای تعیین بخش مورد نظرمان برای اجرای کدهای CSS
تعیین ویژگی های مشترکی برای چند عنصر از نوع های مختلف، به صورت همزمان، در CSS
حالت های مختلف برای تعیین ویژگی های عنصرهای یک صفحه، به صورت ترکیب سه مورد ((تمامی عنصرهای از آن نوع در صفحه))، ((عنصری از آن نوع با یک id خاص)) و ((عنصرهای از آن نوع و متعلق به یک کلاس (class)))، در CSS

منبع: kelidestan

P O U R I A · Jul 28, 2015

شروع یادگیری CSS

شروع یادگیری CSS

همان طور که می دانید ساختار اصلی صفحات هر سایت با استفاده از کدهای html نوشته می شود . اما نوشتن صفحات یک سایت با html مشکلاتی را به وجود می آورد . مثلا فرض کنید سایت شما در ابتدا 10 صفحه داشته باشد و شما قبلا در میان کدهای html ، رنگ پس زمینه سایت خود را آبی انتخاب کرده اید ، بعد از گذشت مدتی شما به نظرتان می آید که رنگ سبز برای پس زمینه مناسب تر است بنابراین باید هر 10 صفحه سایت را یکی یکی باز کنید و کد مربوط به رنگ پس زمینه را تغییر دهید . اکنون فرض کنید که سایت شما دارای 1000 صفحه باشد ، می بینید که دیگر تغییر رنگ پس زمینه سایت واقعا شکنجه آور می شود و شما کل زمانی را که برای نوشتن مباحث جدید در سایت داشتید باید بگذارید و کدهای این 1000 صفحه را تغییر دهید .

راه حل این مشکل استفاده از CSS است . شما برای 1000 صفحه سایت خود تنها یک فایل CSS می سازید و در آن فایل کد مربوط به رنگ پس زمینه را قید می کنید و سپس در 1000 صفحه سایت به این فایل CSS ارجاع می دهید و بنابراین هر بار که تصمیم به تغییر رنگ پس زمینه گرفتید تنها کافی است که یک خط از کدها در فایل CSS را تغییر دهید . همان طور که متوجه شدید استفاده از CSS در کدنویسی سایت بسیار ضروری است .

دقت کنید که قبل از یادگیری کدنویسی CSS ، شما باید آشنایی مختصری با html داشته باشید . بنابراین اگر با کدنویسی html آشنایی ندارد ابتدا مباحث مربوط به آن را در بخش آموزش html سایت کلیدستان بخوانید (البته مباحث ساده) و سپس یادگیری CSS را شروع کنید . اگر با html آشنا هستید می توانید مبحث بعدی آموزش CSS را بخوانید .

P O U R I A · Jul 28, 2015

شیوه های به کار بردن کدهای CSS

شیوه های به کار بردن کدهای CSS

برای به کار بردن کدهای CSS دو شیوه را به شما معرفی می کنم . یکی نوشتن کدهای CSS در یک فایل جدا از فایل صفحات html و دیگری نوشتن کدهای CSS در میان کدهای html هر صفحه . خوب مسلما روش اصلی ، همان نوشتن کدهای CSS در یک فایل جداگانه می باشد زیرا اگر قرار باشد کدهای CSS را درون هر صفحه html بنویسیم که مجبور خواهیم بود برای هر بار تغییر سایت ، همه صفحات را باز کرده و کدهای CSS را تغییر دهیم . در آموزش های CSS سایت کلیدستان ، ابتدا به شما یاد می دهم که چگونه کدهای CSS را در فایلی جداگانه بنویسید اما پس از آن در تمامی مثال ها ، کدهای CSS را به همراه کدهای html می نویسم (نه در فایلی جداگانه) و هدفم هم این است که شما به راحتی بتوانید همه کدها را سریع در فایلی در کامپیوترتان کپی کرده و نتیجه را مشاهده کنید و با تغییر دادن آن متوجه شوید که چگونه نتایج تغییر می کند زیرا فعلا هدف این است که شما کدنویسی CSS را یاد بگیرید .

نوشتن کدهای CSS در فایلی جداگانه :

ابتدا روش اصلی نوشتن کدهای CSS که همان نوشتن کدهای CSS در فایلی جداگانه می باشد را شرح می دهم . اول باید بگویم که چگونه فایل html و فایل CSS را بسازید . برای ساخت این دو فایل می توانید از هر نرم افزار ویرایش متن دلخواه استفاده کنید . ساده ترین نرم افزار برای ساخت هر دو فایل html و CSS ، نرم افزار Notepad در ویندوز می باشد که آن را می توانید در منوی ویندوز بیابید . همچنین نرم افزار Adobe Dreamweaver نیز نرم افزاری حرفه ای و بسیار مناسب می باشد و من آن را به شما توصیه می کنم . این نرم افزار به کدنویسی شما سرعت می بخشد و با رنگی کردن بخش های مختلف کدها ، باعث می شود که دید بهتری نسبت به کدهای نوشته شده داشته باشید .

ابتدا فایل مربوط به html را می سازیم . کدهای زیر را در نرم افزار ویرایشگر متن کپی کنید :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace][COLOR=#009900]<[COLOR=#000000][B]html[/B][/COLOR]>[/COLOR]
 
[COLOR=#009900]<[COLOR=#000000][B]head[/B][/COLOR]>[/COLOR]
[COLOR=#009900]<[COLOR=#66CC66]/[/COLOR][COLOR=#000000][B]head[/B][/COLOR]>[/COLOR]
 
[COLOR=#009900]<[COLOR=#000000][B]body[/B][/COLOR] [COLOR=#000066]bgcolor[/COLOR][COLOR=#66CC66]=[/COLOR][COLOR=#FF0000]"blue"[/COLOR]>[/COLOR]
 
[COLOR=#009900]<[COLOR=#000000][B]p[/B][/COLOR]>[/COLOR]this is a paragraph[COLOR=#009900]<[COLOR=#66CC66]/[/COLOR][COLOR=#000000][B]p[/B][/COLOR]>[/COLOR] 
 
[COLOR=#009900]<[COLOR=#66CC66]/[/COLOR][COLOR=#000000][B]body[/B][/COLOR]>[/COLOR]
[COLOR=#009900]<[COLOR=#66CC66]/[/COLOR][COLOR=#000000][B]html[/B][/COLOR]>[/COLOR][/FONT]
[/FONT][/COLOR]

سپس فایل را با نامی دلخواه (معمولا index انتخاب می شود) و با پسوند html. ذخیره کنید و آن را با مرورگر اینترنت خود باز کنید .

همان طور که می دانید کدهای یک صفحه html ، با تگ <html> شروع شده و با تگ <html/> پایان می یابد . درون این دو تگ ، کدهای html به دو بخش head و body تقسیم می شوند که کدهای بخش head ، با تگ <head> شروع شده و با تگ <head/> پایان می یابند . کدهای بخش head در مرورگر اینترنت نمایش داده نمی شوند و تنها اطلاعاتی را در مورد صفحه html نوشته شده فراهم می کنند که البته فعلا ما کدی برای این بخش نمی نویسیم و تنها دو تگ آن را نوشته ایم تا فراموش نشود . کدهایی که نتیجه آنها در مرورگر اینترنت نمایش داده می شود باید در بخش body نوشته شوند . کد های بخش body ، با تگ <body> شروع شده و با تگ <body/> پایان می یابند . زوج تگ <p> و <p/> هم برای ساختن یک پاراگراف به کار می روند . دقت شود که درون تگ <body> ، مشخصه bgcolor را برابر blue تعیین کرده ایم که باعث می شود رنگ پس زمینه به رنگ آبی نمایش داده شود .

نتیجه :

خوب این روش معمولی تعیین رنگ پس زمینه با کدهای html بود و تنها برای مقایسه با روش استفاده از CSS آن را شرح دادیم . اما ما اکنون می خواهیم یک فایل CSS بسازیم که در آن با کدهای CSS تعیین کنیم که رنگ پس زمینه صفحه به چه صورت باشد . ابتدا فایل CSS را می سازیم ، برای این منظور کدهای زیر را در نرم افزار ویرایشگر متن خود کپی کنید :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace][COLOR=#A1A100]@charset "utf-8";[/COLOR]

body [COLOR=#00AA00]{[/COLOR]
          [B]background-color[/B][COLOR=#00AA00]:[/COLOR][B]blue[/B][COLOR=#00AA00];[/COLOR]
     [COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

سپس آن را با نام MyStyle.css ذخیره کنید . دقت کنید که پسوند فایل حتما باید css. باشد که پسوند مخصوص فایل های CSS است . در فایل CSS ، ابتدا کلمه body را نوشته ایم که یعنی باید تغییرات برای تگ body در کدهای html هر صفحه ای که به این فایل CSS ارجاع می دهد ، صورت گیرد . زیرا تعیین رنگ پس زمینه با استفاده از تگ body انجام می شود . سپس دو علامت } و { را آورده ایم که نشان می دهد که مشخصه هایی که تعیین خواهیم کرد مربوط به تگ body است که البته در اینجا ما تنها یک مشخصه نوشته ایم . مشخصه مد نظر ما background-color است که آن را برابر blue تعیین کرده ایم . در پایان نیز علامت ; را نوشته ایم . دقت شود که اگر مثلا 5 مشخصه مختلف را می خواستیم برای تگ body بنویسیم ، باید آنها را در میان دو علامت } و { می نوشتیم و به این صورت که هر کدام در خطی جداگانه نوشته شده و در انتهای هر کدام ، علامت ; قرار داده شود .

حال باید کدهای html صفحه را بنویسیم ، نسبت به روش معمولی که گفته شد ، باید در کدهای html صفحه ، مشخصه bgcolor را حذف کنیم و یک ارجاع به فایل CSS نیز بنویسیم :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace][COLOR=#009900]<[COLOR=#000000][B]html[/B][/COLOR]>[/COLOR]
 
[COLOR=#009900]<[COLOR=#000000][B]head[/B][/COLOR]>[/COLOR]
[COLOR=#009900]<[COLOR=#000000][B]link[/B][/COLOR] [COLOR=#000066]href[/COLOR][COLOR=#66CC66]=[/COLOR][COLOR=#FF0000]"MyStyle.css"[/COLOR] [COLOR=#000066]rel[/COLOR][COLOR=#66CC66]=[/COLOR][COLOR=#FF0000]"stylesheet"[/COLOR] [COLOR=#000066]type[/COLOR][COLOR=#66CC66]=[/COLOR][COLOR=#FF0000]"text/css"[/COLOR] [COLOR=#000066]media[/COLOR][COLOR=#66CC66]=[/COLOR][COLOR=#FF0000]"screen"[/COLOR] [COLOR=#66CC66]/[/COLOR]>[/COLOR]
[COLOR=#009900]<[COLOR=#66CC66]/[/COLOR][COLOR=#000000][B]head[/B][/COLOR]>[/COLOR]
 
[COLOR=#009900]<[COLOR=#000000][B]body[/B][/COLOR]>[/COLOR]
 
[COLOR=#009900]<[COLOR=#000000][B]p[/B][/COLOR]>[/COLOR]this is a paragraph[COLOR=#009900]<[COLOR=#66CC66]/[/COLOR][COLOR=#000000][B]p[/B][/COLOR]>[/COLOR] 
 
[COLOR=#009900]<[COLOR=#66CC66]/[/COLOR][COLOR=#000000][B]body[/B][/COLOR]>[/COLOR]
[COLOR=#009900]<[COLOR=#66CC66]/[/COLOR][COLOR=#000000][B]html[/B][/COLOR]>[/COLOR][/FONT]
[/FONT][/COLOR]

سپس فایل را با نام index.html که دارای پسوند html است ، در همان فولدری که فایل MyStyle.css قرار دارد ، ذخیره کنید و آن را با مرورگر اینترنت خود اجرا کنید . دقت شود که مشخصه bgcolor دیگر در تگ body نوشته نشده و همچنین با تگ <link> ، یک ارجاع به فایل MyStyle.css مشخص کرده ایم . دقت شود که تگ <link> باید در بخش head از کدهای html صفحه ، یعنی میان دو تگ <head> و <head/> ، نوشته شود . در تگ <link> ، با مشخصه href باید آدرس فایل CSS ای را که به آن ارجاع می دهیم ، مشخص کنیم . احتیاجی به حفظ کردن عبارت نوشته شده برای تگ <link> نیست و تنها می توانید این عبارت را در فایل های خود کپی کرده و در مواقعی که لازم شود ، فقط احتیاج به تغییر آدرس تعیین شده برای مشخصه href داریم .

بنابراین یاد گرفتیم که چگونه یک فایل CSS را ساخته و سپس در صفحات html به آن فایل CSS ارجاع بدهیم .

نوشتن کدهای CSS در خود صفحه html :

همان طور که گفتیم ، می توان کدهای CSS را در خود صفحه html هم نوشت که در این صورت دیگر احتیاجی به ساخت فایل CSS نمی باشد . اما همین جا تذکر می دهم که روش اصلی و حرفه ای استفاده از کدهای CSS ، همان ساخت فایل CSS و نوشتن کدهای CSS درون آن می باشد . اما در سایت کلیدستان در مباحث دیگری که شرح می دهیم ، کدهای CSS را در خود صفحه html می نویسیم تا شما به راحتی و تنها با ساختن یک فایل html بتوانید نتیجه کدها را بنویسید و درگیر ساخت دو فایل ، آدرس دهی و ... نشوید . زیرا فعلا هدف ما یادگیری برنامه نویسی CSS می باشد و بعد که حرفه ای شدید ، خودتان کدهای CSS مورد نظرتان را در فایلی جداگانه بنویسید .

اکنون همان مثال قبلی را این بار به شیوه ای دیگر می نویسیم تا کدهای CSS درون خود فایل html اجرا شوند . کدهای زیر را در نرم افزار ویرایش متن خود کپی کنید :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace][COLOR=#009900]<[COLOR=#000000][B]html[/B][/COLOR]>[/COLOR]
 
[COLOR=#009900]<[COLOR=#000000][B]head[/B][/COLOR]>[/COLOR]
[COLOR=#009900]<[COLOR=#000000][B]style[/B][/COLOR] [COLOR=#000066]type[/COLOR][COLOR=#66CC66]=[/COLOR][COLOR=#FF0000]"text/css"[/COLOR]>[/COLOR]
body {
      background-color:blue;
     }      
[COLOR=#009900]<[COLOR=#66CC66]/[/COLOR][COLOR=#000000][B]style[/B][/COLOR]>[/COLOR]
[COLOR=#009900]<[COLOR=#66CC66]/[/COLOR][COLOR=#000000][B]head[/B][/COLOR]>[/COLOR]
 
[COLOR=#009900]<[COLOR=#000000][B]body[/B][/COLOR]>[/COLOR]
 
[COLOR=#009900]<[COLOR=#000000][B]p[/B][/COLOR]>[/COLOR]this is a paragraph[COLOR=#009900]<[COLOR=#66CC66]/[/COLOR][COLOR=#000000][B]p[/B][/COLOR]>[/COLOR] 
 
[COLOR=#009900]<[COLOR=#66CC66]/[/COLOR][COLOR=#000000][B]body[/B][/COLOR]>[/COLOR]
[COLOR=#009900]<[COLOR=#66CC66]/[/COLOR][COLOR=#000000][B]html[/B][/COLOR]>[/COLOR][/FONT]
[/FONT][/COLOR]

سپس فایل را با نام index.html که دارای پسوند html می باشد ، ذخیره کرده و آن را با مرورگر اینترنت خود باز کنید . مشاهده می کنید که برای نوشتن کدهای CSS درون فایل html ، از زوج تگ <style> و <style/> استفاده کرده ایم که این دو تگ باید در بخش head صفحه html ، یعنی بین دو تگ <head> و <head/> ، نوشته شوند . همان کدهای مربوط به تگ body را که در مثال قبل در فایل CSS نوشته بودیم ، این بار بین دو تگ <style> و <style/> ذکر کرده ایم . دقت شود که در تگ <style> ، مشخصه type به صورت text/css تعیین شده است .

نتیجه :

P O U R I A · Jul 28, 2015

تعیین رنگ فونت ها با مشخصه color در CSS

تعیین رنگ فونت ها با مشخصه color در CSS

قبل از ادامه آموزش CSS ، نیاز دارم که یک مشخصه ساده را به شما آموزش بدهم تا سپس در مباحث بعدی ، با مثال هایی بر اساس این مشخصه ، اصولی مهم را در مورد کدنویسی CSS در همین مباحث اولیه برایتان شرح بدهم .

مشخصه color در CSS برای تعیین رنگ فونت های به کار رفته ، مورد استفاده قرار می گیرد و تنها شما باید در میان کدهای CSS تعیین کنید که می خواهید این مشخصه برای کدام بخش از کدهای html اجرا شود . به مثال زیر توجه کنید :

[h=4]مثال :[/h]

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]<html[COLOR=#00AA00]>[/COLOR]
 
<head[COLOR=#00AA00]>[/COLOR]
<style type[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"text/css"[/COLOR][COLOR=#00AA00]>[/COLOR]
body [COLOR=#00AA00]{[/COLOR]
      [B]color[/B][COLOR=#00AA00]:[/COLOR][B]blue[/B][COLOR=#00AA00];[/COLOR]
     [COLOR=#00AA00]}[/COLOR]      
</style[COLOR=#00AA00]>[/COLOR]
</head[COLOR=#00AA00]>[/COLOR]
 
<body[COLOR=#00AA00]>[/COLOR]
 
<p[COLOR=#00AA00]>[/COLOR]this is a paragraph</p[COLOR=#00AA00]>[/COLOR] 
 
</body[COLOR=#00AA00]>[/COLOR]
</html[COLOR=#00AA00]>[/COLOR][/FONT]
[/FONT][/COLOR]

کدهای CSS را در بخش head صفحه html نوشته ایم و تعیین کرده ایم که مشخصه color برابر blue (آبی رنگ) قرار داده شود و تعیین کرده ایم که این مشخصه برای کدهای درون تگ های <body> و <body/> اجرا شود .

[h=4]نتیجه :[/h]

مشاهده می کنید که فونت ها به رنگ آبی نمایش داده شده اند .

P O U R I A · Jul 28, 2015

مشخصه class برای کلاس بندی بخش های مورد نظرمان برای اجرای کد CSS

مشخصه class برای کلاس بندی بخش های مورد نظرمان برای اجرای کد CSS

قبلا گفتیم که مثلا با مشخصه color می توانیم فونت های درون بخش body صفحه html را به رنگ خاصی درآوریم ، اما ممکن است که مثلا بخش body صفحه html شامل تعداد زیادی پاراگراف باشد و ما تنها بخواهیم دو یا سه تا از آنها با رنگ فونت متفاوتی نمایش داده شوند . واضح است که اگر به صورت معمولی ، مشخصه color را روی بخش body صفحه html اعمال کنیم ، تمامی پاراگراف های درون آن تغییر رنگ خواهند داشت و این مد نظر ما نیست .

در این مواقع ، استفاده از مشخصه class می تواند مشکل را حل کند . مشخصه class برای کلاس بندی تگ های مختلف به کار می رود . یعنی به چند تگ ، اسم کلاس خاصی را نسبت می دهیم و سپس در کدهای CSS ، ذکر می کنیم که برای تمامی تگ های دارای آن نام کلاس ، تغییر دلخواهمان صورت گیرد . برای درک این موضوع ، به مثال زیر توجه کنید :

[h=4]مثال :[/h]صفحه html ای با 5 پاراگراف ساخته و به سه تای آن پاراگراف ها ، نام کلاس color_change را اختصاص می دهیم و سپس در کدهای CSS ، رنگ تمامی پاراگراف های دارای نام کلاس color_change را با مشخصه color به رنگ قرمز تغییر می دهیم :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]<html[COLOR=#00AA00]>[/COLOR]
 
<head[COLOR=#00AA00]>[/COLOR]
<style type[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"text/css"[/COLOR][COLOR=#00AA00]>[/COLOR]
[COLOR=#6666FF].change_color[/COLOR] [COLOR=#00AA00]{[/COLOR]
               [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#993333]red[/COLOR][COLOR=#00AA00];[/COLOR]
              [COLOR=#00AA00]}[/COLOR]      
</style[COLOR=#00AA00]>[/COLOR]
</head[COLOR=#00AA00]>[/COLOR]
 
<body[COLOR=#00AA00]>[/COLOR]
 
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"change_color"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]1[/COLOR] .</p[COLOR=#00AA00]>[/COLOR] 
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]2[/COLOR] .</p[COLOR=#00AA00]>[/COLOR] 
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"change_color"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]3[/COLOR] .</p[COLOR=#00AA00]>[/COLOR] 
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]4[/COLOR] .</p[COLOR=#00AA00]>[/COLOR] 
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"change_color"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]5[/COLOR] .</p[COLOR=#00AA00]>[/COLOR] 
 
</body[COLOR=#00AA00]>[/COLOR]
</html[COLOR=#00AA00]>[/COLOR][/FONT]
[/FONT][/COLOR]

نکته مهم این است که حتما باید قبل از ذکر نام کلاس (class) ، علامت نقطه (.) نوشته شود .

[h=4]نتیجه :[/h]

[h=2]ترکیب تگ div و مشخصه class برای کلاس بندی راحت تر در CSS :[/h]ترکیب استفاده از تگ div و مشخصه class می تواند حجم کدنویسی را در هنگام کلاس بندی تگ های مختلف کاهش دهد . تگ div برای بخش بندی کدهای html به کار می رود (تبدیل کد html به بخش های مختلف) و بسیار سودمند است . برای درک این موضوع ، به مثال زیر توجه کنید :

[h=4]مثال :[/h]یک صفحه html می سازیم که در آن 5 پاراگراف وجود دارد و می خواهیم که 3 پاراگراف اول با رنگ قرمز نمایش داده شوند . اگر تنها بخواهیم ، مشخصه class را برای تگ های p بنویسیم باید سه بار این کار را انجام دهیم . اما راه حل ساده تری هم وجود دارد و آن این است که سه پاراگراف اول را درون یک تگ div قرار بدهیم و سپس مشخصه class را برای تگ div تعیین کنیم . سپس زمانی که مشخصه color را برای تگ div به رنگ قرمز تغییر می دهیم باعث می شود پاراگراف های درون آن به رنگ قرمز نمایش داده شوند :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]<html[COLOR=#00AA00]>[/COLOR]
 
<head[COLOR=#00AA00]>[/COLOR]
<style type[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"text/css"[/COLOR][COLOR=#00AA00]>[/COLOR]
[COLOR=#6666FF].change_color[/COLOR] [COLOR=#00AA00]{[/COLOR]
               [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#993333]red[/COLOR][COLOR=#00AA00];[/COLOR]
              [COLOR=#00AA00]}[/COLOR]      
</style[COLOR=#00AA00]>[/COLOR]
</head[COLOR=#00AA00]>[/COLOR]
 
<body[COLOR=#00AA00]>[/COLOR]
 
   <div class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"change_color"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]1[/COLOR] .</p[COLOR=#00AA00]>[/COLOR] 
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]2[/COLOR] .</p[COLOR=#00AA00]>[/COLOR] 
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]3[/COLOR] .</p[COLOR=#00AA00]>[/COLOR] 
   </div[COLOR=#00AA00]>[/COLOR]
   
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]4[/COLOR] .</p[COLOR=#00AA00]>[/COLOR] 
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]5[/COLOR] .</p[COLOR=#00AA00]>[/COLOR] 
 
</body[COLOR=#00AA00]>[/COLOR]
</html[COLOR=#00AA00]>[/COLOR][/FONT]
[/FONT][/COLOR]

[h=4]نتیجه :[/h]

P O U R I A · Jul 28, 2015

مشخصه id برای تعیین بخش مورد نظرمان برای اجرای کدهای CSS

مشخصه id برای تعیین بخش مورد نظرمان برای اجرای کدهای CSS

با استفاده از مشخصه id ، می توانیم برای یک بخش خاص ، نامی را تعیین کنیم (یک id) و البته این نام باید منحصربفرد باشد . زمانی که بخش مورد نظرمان دارای یک نام منحصربفرد باشد ، آنگاه می توانیم درون کدهای CSS ، نام آن بخش مورد نظرمان را ذکر کنیم و سپس مشخصات دلخواهی را برای آن بخش تعیین کنیم . به مثال زیر توجه کنید :

[h=4]مثال :[/h]

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]<html[COLOR=#00AA00]>[/COLOR]
 
<head[COLOR=#00AA00]>[/COLOR]
<style type[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"text/css"[/COLOR][COLOR=#00AA00]>[/COLOR]
[COLOR=#CC00CC]#red_paragraph[/COLOR] [COLOR=#00AA00]{[/COLOR]
                    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#993333]red[/COLOR][COLOR=#00AA00];[/COLOR]
               [COLOR=#00AA00]}[/COLOR]      
</style[COLOR=#00AA00]>[/COLOR]
</head[COLOR=#00AA00]>[/COLOR]
 
<body[COLOR=#00AA00]>[/COLOR]

<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"red_paragraph"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]1[/COLOR] .</p[COLOR=#00AA00]>[/COLOR] 
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]2[/COLOR] .</p[COLOR=#00AA00]>[/COLOR] 
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]3[/COLOR] .</p[COLOR=#00AA00]>[/COLOR] 

</body[COLOR=#00AA00]>[/COLOR]
</html[COLOR=#00AA00]>[/COLOR][/FONT]
[/FONT][/COLOR]

همان طور که مشاهده می کنید ، برای تگ p اول که مربوط به پاراگراف اول می باشد ، مشخصه id را برابر red_paragraph تعیین کرده ایم که باعث می شود آن پاراگراف را با id معادل red_paragraph شناسایی کنیم . حالا تنها کاری که باید انجام بدهیم این است که درون کدهای CSS ، به این id ، ارجاع بدهیم . این کار توسط علامت # انجام می شود و پس از نوشتن این علامت ، باید نام id را بنویسیم . سپس باید مشخصاتی را که می خواهیم را درون دو علامت } و { بنویسیم . مشخصه color را برابر red انتخاب کرده ایم که باعث می شود پاراگراف اول به رنگ قرمز نمایش داده شود .

[h=4]نتیجه :[/h]

P O U R I A · Jul 28, 2015

تعیین ویژگی های مشترکی برای چند عنصر از نوع های مختلف، به صورت همزمان، در CSS

تعیین ویژگی های مشترکی برای چند عنصر از نوع های مختلف، به صورت همزمان، در CSS

چنانچه قصد داشته باشیم که یک سری ویژگی مشترک را برای چند عنصر از نوع های مختلف، به صورت همزمان تعیین کنیم، همان شیوه کلی تعیین ویژگی ها برای یک عنصر به کار می رود و تنها تفاوت این است که باید نام تمام آن عنصرها را قبل از مشخصه ها ذکر کنیم و در بین نام آنها، علامت , را بنویسیم. مثل کد زیر :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]body[COLOR=#00AA00],[/COLOR] div[COLOR=#00AA00],[/COLOR] h1[COLOR=#00AA00],[/COLOR] h2[COLOR=#00AA00],[/COLOR] h3[COLOR=#00AA00],[/COLOR] h4[COLOR=#00AA00],[/COLOR] h5[COLOR=#00AA00],[/COLOR] h6[COLOR=#00AA00],[/COLOR] p[COLOR=#00AA00],[/COLOR] ul[COLOR=#00AA00],[/COLOR] img [COLOR=#00AA00]{[/COLOR]
    [B]margin[/B][COLOR=#00AA00]:[/COLOR][COLOR=#993333]0px[/COLOR][COLOR=#00AA00];[/COLOR]
    [B]padding[/B][COLOR=#00AA00]:[/COLOR][COLOR=#993333]0px[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

P O U R I A · Jul 28, 2015

حالت های مختلف برای تعیین ویژگی های عنصرهای یک صفحه

حالت های مختلف برای تعیین ویژگی های عنصرهای یک صفحه

حالت های مختلف برای تعیین ویژگی های عنصرهای یک صفحه، به صورت ترکیب سه مورد ((تمامی عنصرهای از آن نوع در صفحه))، ((عنصری از آن نوع با یک id خاص)) و ((عنصرهای از آن نوع و متعلق به یک کلاس (class)))، در CSS :

در مباحث قبلی، چگونگی تعیین (تغییر) ویژگی های یک عنصر در صفحه را به صورت 3 مورد زیر شرح دادیم :1- تغییرات به تمامی عنصرهای از آن نوع اعمال شود.2- تغییرات تنها به عنصری از آن نوع که دارای یک id خاص است، اعمال شود.3- تغییرات تنها به عنصرهایی از آن نوع که متعلق به یک کلاس (class) خاص هستند، اعمال شود.اکنون قصد داریم که شیوه به کار بردن ترکیبی این سه مورد را شرح بدهیم.به عنوان مثال، عنصر را برابر عنصر p ، یعنی همان تگ p که برای نمایش یک پاراگراف (paragraph) به کار می رود، در نظر می گیریم (البته عنصر div را هم در مثال به کار می بریم زیرا یک عنصر ساختاری و مهم است). اکنون برای هر سه مورد، شیوه کلی کدنویسی را دوباره یادآوری می کنیم و همچنین نحوه به کار بردن ترکیب آنها را هم شرح خواهیم داد.برای این منظور، ابتدا کدهای صفحه را به صورت زیر در نظر بگیرید :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]<html[COLOR=#00AA00]>[/COLOR]
<head[COLOR=#00AA00]>[/COLOR]
<style type[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"text/css"[/COLOR][COLOR=#00AA00]>[/COLOR]
[COLOR=#808080][I]/* your CSS code */[/I][/COLOR]
</style[COLOR=#00AA00]>[/COLOR]
</head[COLOR=#00AA00]>[/COLOR]

<body[COLOR=#00AA00]>[/COLOR]

<div[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]1[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]2[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]1[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]3[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]4[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]2[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]5[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]6[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]3[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<span id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]4[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
<br /[COLOR=#00AA00]>[/COLOR]
<span class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]5[/COLOR].</span[COLOR=#00AA00]>[/COLOR]

</body[COLOR=#00AA00]>[/COLOR]
</html[COLOR=#00AA00]>[/COLOR][/FONT]
[/FONT][/COLOR]

دقت شود که بنده عمدا دو بار id با نام myID_1 را به کار برده ام و به دلیل نمایش بهتر کلیه حالت ها به شما است، در صورتی که نباید دو id با نام یکسان داشته باشیم (id ها را به صورت منحصربفرد انتخاب می کنند).در کدهای بالا، باید به جای عبارت /* your CSS code */ ، کدهای CSS مورد نظر خود را بنویسید.اکنون در ادامه شرح می دهیم که برای حالت های مختلف، کدهای CSS باید به چه صورت نوشته شوند (نتیجه هر حالت، در انتهای مبحث نمایش داده شده است) :

1- متن درون همه پاراگراف ها (عنصر p - تگ p)، به رنگ قرمز (یعنی رنگ معادل کد #F00) نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]p [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

2- متن درون همه عنصرهای div ، به رنگ قرمز نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]div [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

3- متن درون عنصر (هر نوع عنصر) با id برابر myID_1 ، به رنگ قرمز نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace][COLOR=#CC00CC]#myID_1[/COLOR] [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

4- متن درون همه عنصرهای (هر نوع عنصر) با کلاس (class) برابر myClass_1 ، به رنگ قرمز نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace][COLOR=#6666FF].myClass_1[/COLOR] [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

5- متن درون عنصر div با id برابر myID_1 ، به رنگ قرمز نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]div[COLOR=#CC00CC]#myID_1[/COLOR] [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

6- متن درون همه عنصرهای div با کلاس (class) برابر myClass_1 ، به رنگ قرمز نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]div[COLOR=#6666FF].myClass_1[/COLOR] [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

7- متن درون عنصر p با id برابر myID_1 ، به رنگ قرمز نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]p[COLOR=#CC00CC]#myID_2[/COLOR] [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

8- متن درون همه عنصرهای p با کلاس (class) برابر myClass_1 ، به رنگ قرمز نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]p[COLOR=#6666FF].myClass_2[/COLOR] [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

9- متن درون همه عنصرهای p قرار گرفته درون عنصر (هر نوع عنصر) با id برابر myID_1 ، به رنگ قرمز نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace][COLOR=#CC00CC]#myID_1[/COLOR] p [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

10- متن درون همه عنصرهای p قرار گرفته درون عنصرهای (هر نوع عنصر) با کلاس (class) برابر myClass_1 ، به رنگ قرمز نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace][COLOR=#6666FF].myClass_1[/COLOR] p [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

11- متن درون همه عنصرهای p قرار گرفته درون عنصر div با id برابر myID_1 ، به رنگ قرمز نمایش داده شود :
div#myID_1 p {
color:#F00;
}

12- متن درون همه عنصرهای p قرار گرفته درون عنصرهای div با کلاس (class) برابر myClass_1 ، به رنگ قرمز نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]div[COLOR=#6666FF].myClass_1[/COLOR] p [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

کد کامل و نتیجه :

اکنون همان حالت هایی که ذکر کردیم را به صورت کد کامل می نویسیم و نتیجه را هم به شما نمایش می دهیم تا نحوه عملکرد آنها را به خوبی درک کنید :

1- متن درون همه پاراگراف ها (عنصر p - تگ p)، به رنگ قرمز (یعنی رنگ معادل کد #F00) نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]p [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

کد کامل :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]<html[COLOR=#00AA00]>[/COLOR]
<head[COLOR=#00AA00]>[/COLOR]
<style type[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"text/css"[/COLOR][COLOR=#00AA00]>[/COLOR]
p [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR]
</style[COLOR=#00AA00]>[/COLOR]
</head[COLOR=#00AA00]>[/COLOR]

<body[COLOR=#00AA00]>[/COLOR]

<div[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]1[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]2[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]1[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]3[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]4[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]2[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]5[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]6[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]3[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<span id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]4[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
<br /[COLOR=#00AA00]>[/COLOR]
<span class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]5[/COLOR].</span[COLOR=#00AA00]>[/COLOR]

</body[COLOR=#00AA00]>[/COLOR]
</html[COLOR=#00AA00]>[/COLOR][/FONT]
[/FONT][/COLOR]

نتیجه :

2- متن درون همه عنصرهای div ، به رنگ قرمز نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]div [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

کد کامل :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]<html[COLOR=#00AA00]>[/COLOR]
<head[COLOR=#00AA00]>[/COLOR]
<style type[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"text/css"[/COLOR][COLOR=#00AA00]>[/COLOR]
div [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR]
</style[COLOR=#00AA00]>[/COLOR]
</head[COLOR=#00AA00]>[/COLOR]

<body[COLOR=#00AA00]>[/COLOR]

<div[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]1[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]2[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]1[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]3[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]4[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]2[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]5[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]6[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]3[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<span id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]4[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
<br /[COLOR=#00AA00]>[/COLOR]
<span class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]5[/COLOR].</span[COLOR=#00AA00]>[/COLOR]

</body[COLOR=#00AA00]>[/COLOR]
</html[COLOR=#00AA00]>[/COLOR][/FONT]
[/FONT][/COLOR]

نتیجه :

3- متن درون عنصر (هر نوع عنصر) با id برابر myID_1 ، به رنگ قرمز نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace][COLOR=#CC00CC]#myID_1[/COLOR] [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

کد کامل :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]<html[COLOR=#00AA00]>[/COLOR]
<head[COLOR=#00AA00]>[/COLOR]
<style type[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"text/css"[/COLOR][COLOR=#00AA00]>[/COLOR]
[COLOR=#CC00CC]#myID_1[/COLOR] [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR]
</style[COLOR=#00AA00]>[/COLOR]
</head[COLOR=#00AA00]>[/COLOR]

<body[COLOR=#00AA00]>[/COLOR]

<div[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]1[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]2[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]1[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]3[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]4[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]2[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]5[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]6[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]3[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<span id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]4[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
<br /[COLOR=#00AA00]>[/COLOR]
<span class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]5[/COLOR].</span[COLOR=#00AA00]>[/COLOR]

</body[COLOR=#00AA00]>[/COLOR]
</html[COLOR=#00AA00]>[/COLOR][/FONT]
[/FONT][/COLOR]

نتیجه :

4- متن درون همه عنصرهای (هر نوع عنصر) با کلاس (class) برابر myClass_1 ، به رنگ قرمز نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace][COLOR=#6666FF].myClass_1[/COLOR] [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

کد کامل :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]<html[COLOR=#00AA00]>[/COLOR]
<head[COLOR=#00AA00]>[/COLOR]
<style type[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"text/css"[/COLOR][COLOR=#00AA00]>[/COLOR]
[COLOR=#6666FF].myClass_1[/COLOR] [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR]
</style[COLOR=#00AA00]>[/COLOR]
</head[COLOR=#00AA00]>[/COLOR]

<body[COLOR=#00AA00]>[/COLOR]

<div[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]1[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]2[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]1[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]3[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]4[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]2[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]5[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]6[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]3[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<span id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]4[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
<br /[COLOR=#00AA00]>[/COLOR]
<span class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]5[/COLOR].</span[COLOR=#00AA00]>[/COLOR]

</body[COLOR=#00AA00]>[/COLOR]
</html[COLOR=#00AA00]>[/COLOR][/FONT]
[/FONT][/COLOR]

نتیجه :

5- متن درون عنصر div با id برابر myID_1 ، به رنگ قرمز نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]div[COLOR=#CC00CC]#myID_1[/COLOR] [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

کد کامل :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]<html[COLOR=#00AA00]>[/COLOR]
<head[COLOR=#00AA00]>[/COLOR]
<style type[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"text/css"[/COLOR][COLOR=#00AA00]>[/COLOR]
div[COLOR=#CC00CC]#myID_1[/COLOR] [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR]
</style[COLOR=#00AA00]>[/COLOR]
</head[COLOR=#00AA00]>[/COLOR]

<body[COLOR=#00AA00]>[/COLOR]

<div[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]1[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]2[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]1[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]3[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]4[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]2[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]5[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]6[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]3[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<span id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]4[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
<br /[COLOR=#00AA00]>[/COLOR]
<span class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]5[/COLOR].</span[COLOR=#00AA00]>[/COLOR]

</body[COLOR=#00AA00]>[/COLOR]
</html[COLOR=#00AA00]>[/COLOR][/FONT]
[/FONT][/COLOR]

نتیجه :

6- متن درون همه عنصرهای div با کلاس (class) برابر myClass_1 ، به رنگ قرمز نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]div[COLOR=#6666FF].myClass_1[/COLOR] [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

کد کامل :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]<html[COLOR=#00AA00]>[/COLOR]
<head[COLOR=#00AA00]>[/COLOR]
<style type[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"text/css"[/COLOR][COLOR=#00AA00]>[/COLOR]
div[COLOR=#6666FF].myClass_1[/COLOR] [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR]
</style[COLOR=#00AA00]>[/COLOR]
</head[COLOR=#00AA00]>[/COLOR]

<body[COLOR=#00AA00]>[/COLOR]

<div[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]1[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]2[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]1[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]3[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]4[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]2[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]5[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]6[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]3[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<span id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]4[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
<br /[COLOR=#00AA00]>[/COLOR]
<span class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]5[/COLOR].</span[COLOR=#00AA00]>[/COLOR]

</body[COLOR=#00AA00]>[/COLOR]
</html[COLOR=#00AA00]>[/COLOR][/FONT]
[/FONT][/COLOR]

نتیجه :

7- متن درون عنصر p با id برابر myID_1 ، به رنگ قرمز نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]p[COLOR=#CC00CC]#myID_2[/COLOR] [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

کد کامل :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]<html[COLOR=#00AA00]>[/COLOR]
<head[COLOR=#00AA00]>[/COLOR]
<style type[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"text/css"[/COLOR][COLOR=#00AA00]>[/COLOR]
p[COLOR=#CC00CC]#myID_2[/COLOR] [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR]
</style[COLOR=#00AA00]>[/COLOR]
</head[COLOR=#00AA00]>[/COLOR]

<body[COLOR=#00AA00]>[/COLOR]

<div[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]1[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]2[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]1[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]3[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]4[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]2[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]5[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]6[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]3[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<span id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]4[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
<br /[COLOR=#00AA00]>[/COLOR]
<span class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]5[/COLOR].</span[COLOR=#00AA00]>[/COLOR]

</body[COLOR=#00AA00]>[/COLOR]
</html[COLOR=#00AA00]>[/COLOR][/FONT]
[/FONT][/COLOR]

نتیجه :

8- متن درون همه عنصرهای p با کلاس (class) برابر myClass_1 ، به رنگ قرمز نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]p[COLOR=#6666FF].myClass_2[/COLOR] [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

کد کامل :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]<html[COLOR=#00AA00]>[/COLOR]
<head[COLOR=#00AA00]>[/COLOR]
<style type[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"text/css"[/COLOR][COLOR=#00AA00]>[/COLOR]
p[COLOR=#6666FF].myClass_2[/COLOR] [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR]
</style[COLOR=#00AA00]>[/COLOR]
</head[COLOR=#00AA00]>[/COLOR]

<body[COLOR=#00AA00]>[/COLOR]

<div[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]1[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]2[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]1[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]3[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]4[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]2[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]5[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]6[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]3[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<span id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]4[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
<br /[COLOR=#00AA00]>[/COLOR]
<span class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]5[/COLOR].</span[COLOR=#00AA00]>[/COLOR]

</body[COLOR=#00AA00]>[/COLOR]
</html[COLOR=#00AA00]>[/COLOR][/FONT]
[/FONT][/COLOR]

نتیجه :

9- متن درون همه عنصرهای p قرار گرفته درون عنصر (هر نوع عنصر) با id برابر myID_1 ، به رنگ قرمز نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace][COLOR=#CC00CC]#myID_1[/COLOR] p [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

کد کامل :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]<html[COLOR=#00AA00]>[/COLOR]
<head[COLOR=#00AA00]>[/COLOR]
<style type[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"text/css"[/COLOR][COLOR=#00AA00]>[/COLOR]
[COLOR=#CC00CC]#myID_1[/COLOR] p [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR]
</style[COLOR=#00AA00]>[/COLOR]
</head[COLOR=#00AA00]>[/COLOR]

<body[COLOR=#00AA00]>[/COLOR]

<div[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]1[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]2[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]1[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]3[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]4[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]2[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]5[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]6[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]3[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<span id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]4[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
<br /[COLOR=#00AA00]>[/COLOR]
<span class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]5[/COLOR].</span[COLOR=#00AA00]>[/COLOR]

</body[COLOR=#00AA00]>[/COLOR]
</html[COLOR=#00AA00]>[/COLOR][/FONT]
[/FONT][/COLOR]

نتیجه :

10- متن درون همه عنصرهای p قرار گرفته درون عنصرهای (هر نوع عنصر) با کلاس (class) برابر myClass_1 ، به رنگ قرمز نمایش داده شود :

کد:

[FONT=monospace][COLOR=#6666FF].myClass_1[/COLOR] p [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]

کد کامل :

کد:

[FONT=monospace]<html[COLOR=#00AA00]>[/COLOR]
<head[COLOR=#00AA00]>[/COLOR]
<style type[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"text/css"[/COLOR][COLOR=#00AA00]>[/COLOR]
[COLOR=#6666FF].myClass_1[/COLOR] p [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR]
</style[COLOR=#00AA00]>[/COLOR]
</head[COLOR=#00AA00]>[/COLOR]

<body[COLOR=#00AA00]>[/COLOR]

<div[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]1[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]2[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]1[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]3[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]4[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]2[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]5[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]6[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]3[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<span id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]4[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
<br /[COLOR=#00AA00]>[/COLOR]
<span class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]5[/COLOR].</span[COLOR=#00AA00]>[/COLOR]

</body[COLOR=#00AA00]>[/COLOR]
</html[COLOR=#00AA00]>[/COLOR][/FONT]

نتیجه :

11- متن درون همه عنصرهای p قرار گرفته درون عنصر div با id برابر myID_1 ، به رنگ قرمز نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]div[COLOR=#CC00CC]#myID_1[/COLOR] p [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

کد کامل :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]<html[COLOR=#00AA00]>[/COLOR]
<head[COLOR=#00AA00]>[/COLOR]
<style type[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"text/css"[/COLOR][COLOR=#00AA00]>[/COLOR]
div[COLOR=#CC00CC]#myID_1[/COLOR] p [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR]
</style[COLOR=#00AA00]>[/COLOR]
</head[COLOR=#00AA00]>[/COLOR]

<body[COLOR=#00AA00]>[/COLOR]

<div[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]1[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]2[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]1[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]3[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]4[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]2[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]5[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]6[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]3[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<span id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]4[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
<br /[COLOR=#00AA00]>[/COLOR]
<span class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]5[/COLOR].</span[COLOR=#00AA00]>[/COLOR]

</body[COLOR=#00AA00]>[/COLOR]
</html[COLOR=#00AA00]>[/COLOR][/FONT]
[/FONT][/COLOR]

نتیجه :

12- متن درون همه عنصرهای p قرار گرفته درون عنصرهای div با کلاس (class) برابر myClass_1 ، به رنگ قرمز نمایش داده شود :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]div[COLOR=#6666FF].myClass_1[/COLOR] p [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR][/FONT]
[/FONT][/COLOR]

کد کامل :

کد:

[COLOR=#000000][FONT=Tahoma][FONT=monospace]<html[COLOR=#00AA00]>[/COLOR]
<head[COLOR=#00AA00]>[/COLOR]
<style type[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"text/css"[/COLOR][COLOR=#00AA00]>[/COLOR]
div[COLOR=#6666FF].myClass_1[/COLOR] p [COLOR=#00AA00]{[/COLOR]
    [B]color[/B][COLOR=#00AA00]:[/COLOR][COLOR=#CC00CC]#F00[/COLOR][COLOR=#00AA00];[/COLOR]
[COLOR=#00AA00]}[/COLOR]
</style[COLOR=#00AA00]>[/COLOR]
</head[COLOR=#00AA00]>[/COLOR]

<body[COLOR=#00AA00]>[/COLOR]

<div[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]1[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p[COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]2[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]1[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]3[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]4[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]2[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<div class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_2"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]5[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<p class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_3"[/COLOR][COLOR=#00AA00]>[/COLOR]paragraph number [COLOR=#CC66CC]6[/COLOR].</p[COLOR=#00AA00]>[/COLOR]
<span[COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]3[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
</div[COLOR=#00AA00]>[/COLOR]

<span id[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myID_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]4[/COLOR].</span[COLOR=#00AA00]>[/COLOR]
<br /[COLOR=#00AA00]>[/COLOR]
<span class[COLOR=#00AA00]=[/COLOR][COLOR=#FF0000]"myClass_1"[/COLOR][COLOR=#00AA00]>[/COLOR]span number [COLOR=#CC66CC]5[/COLOR].</span[COLOR=#00AA00]>[/COLOR]

</body[COLOR=#00AA00]>[/COLOR]
</html[COLOR=#00AA00]>[/COLOR][/FONT]
[/FONT][/COLOR]

نتیجه :

Thread starter	عنوان	تالار	پاسخ ها	تاریخ
	مباحث اولیه برای آشنایی با HTML	HTML , XHTML , CSS	24	Jul 27, 2015
T	رفع غلط املایی اشتباهات برنامه نویسی css html jquery php asp	HTML , XHTML , CSS	0	Feb 28, 2017
T	رفع غلط املایی اشتباهات برنامه نویسی css html jquery php asp	HTML , XHTML , CSS	0	Feb 28, 2017
T	رفع غلط املایی اشتباهات برنامه نویسی css html jquery php asp	HTML , XHTML , CSS	0	Feb 28, 2017
A	قالب استاتیک وب سایت Apital (Html+Css,...)	HTML , XHTML , CSS	0	Nov 3, 2015

مباحث اولیه برای آشنایی با CSS

P O U R I A

مدیر مهندسی شیمی مدیر تالار گفتگوی آزاد

P O U R I A

مدیر مهندسی شیمی مدیر تالار گفتگوی آزاد

P O U R I A

مدیر مهندسی شیمی مدیر تالار گفتگوی آزاد

P O U R I A

مدیر مهندسی شیمی مدیر تالار گفتگوی آزاد

P O U R I A

مدیر مهندسی شیمی مدیر تالار گفتگوی آزاد

P O U R I A

مدیر مهندسی شیمی مدیر تالار گفتگوی آزاد

P O U R I A

مدیر مهندسی شیمی مدیر تالار گفتگوی آزاد

P O U R I A

مدیر مهندسی شیمی مدیر تالار گفتگوی آزاد

Similar threads