Log in
Latest topics
Statistics
We have 24 registered usersThe newest registered user is quibernh
Our users have posted a total of 2246 messages in 615 subjects
وارد کردن CSS در تگهای HTML با استفاده از شناسه Style
Page 1 of 1
وارد کردن CSS در تگهای HTML با استفاده از شناسه Style
ساده ترین راه برای افزودن استایل به یک صفحه استفاده از شناسه style در تگهای HTML است.
برای افزودن استایل به یک تگ باید عبارت " "=style را وارد تگ مربوطه کنیم و ویژگیهای مورد نیاز خود را بین دو دابل کوت ( " ) وارد می کنیم. مثلاً فرض کنید می خواهیم به یک تگ DIV استایل اضافه کنیم. در این صورت تگ DIV به صورت زیر در می آید.
<div style="property:value"
برای نمونه وقتی بخواهیم متن داخل یک DIV به رنگ سبز نمایش داده شود می توانیم به صورت زیر تگ DIV را بنویسیم:
<div style="color:green">متن داخل DIV </div>
توجه کنید که بین ویژگی color و رنگ سبز ( green ) از علامت دو نقطه ( : ) استفاده شده نه از علامت مساوی که در تگهای HTML استفاده می شود. همچنین لازم نیست مقادیر مورد نظر را بین علامت های نقل قول ( " ) قرار دهیم. می توانید نتیجه به کارگیری کد بالا را در سطر زیر مشاهده کنید:
متن داخل DIV
به خاطر داشته باشید که برای اینکه خاصیت این استایل از بین برود باید تگی را که استایل در آن به کار رفته است ببندید. در اینجا تا زمانی که تگ DIV بسته نشده باشد متن ما به رنگ قرمز نمایش داده خواهد شد.
این امکان نیز وجود دارد که به یک تگ HTML بیش از یک ویژگی افزوده شود. تنها کافی است بین ویژگیهای مختلف از یک نقطه ویرگول ( ; ) استفاده کنیم. برای مثال اگر بخواهیم متنی که در یک DIV قرار دارد به رنگ قرمز و به صورت ایتالیک باشد می توانیم به صورت زیر کد DIV را بنویسیم:
<div style="color:red; font-style:italic">این متن قرمز رنگ و ایتالیک است.</div>
نتیجه به صورت زیر خواهد بود:
این متن قرمز رنگ و ایتالیک است.
در این روش می توانیم به هر تعداد که لازم باشد از ویژگیهای مختلف درون یک تگ HTML استفاده کنیم. به مثال زیر توجه کنید:
<div style="color:blue; font-style:italic; font-weight:bold; font-size:12pt; text-align:center">متن مورد نظر اینجا قرار می گیرد.</div>
در این مثال ما متنی را با رنگ آبی، ایتالیک، ضخیم، اندازه فونت 12pt و در وسط صفحه خواهیم داشت:
متن مورد نظر اینجا قرار می گیرد.
در قسمتهای بعدی لیستی را از ویژگیهای مختلفی که با استایل می توانیم آنها را کنترل کنیم خواهیم آورد. در اینجا فقط قصد آموزش نحوه قرارگیری استایل در تگهای HTML را داشتیم
برای افزودن استایل به یک تگ باید عبارت " "=style را وارد تگ مربوطه کنیم و ویژگیهای مورد نیاز خود را بین دو دابل کوت ( " ) وارد می کنیم. مثلاً فرض کنید می خواهیم به یک تگ DIV استایل اضافه کنیم. در این صورت تگ DIV به صورت زیر در می آید.
<div style="property:value"
برای نمونه وقتی بخواهیم متن داخل یک DIV به رنگ سبز نمایش داده شود می توانیم به صورت زیر تگ DIV را بنویسیم:
<div style="color:green">متن داخل DIV </div>
توجه کنید که بین ویژگی color و رنگ سبز ( green ) از علامت دو نقطه ( : ) استفاده شده نه از علامت مساوی که در تگهای HTML استفاده می شود. همچنین لازم نیست مقادیر مورد نظر را بین علامت های نقل قول ( " ) قرار دهیم. می توانید نتیجه به کارگیری کد بالا را در سطر زیر مشاهده کنید:
متن داخل DIV
به خاطر داشته باشید که برای اینکه خاصیت این استایل از بین برود باید تگی را که استایل در آن به کار رفته است ببندید. در اینجا تا زمانی که تگ DIV بسته نشده باشد متن ما به رنگ قرمز نمایش داده خواهد شد.
این امکان نیز وجود دارد که به یک تگ HTML بیش از یک ویژگی افزوده شود. تنها کافی است بین ویژگیهای مختلف از یک نقطه ویرگول ( ; ) استفاده کنیم. برای مثال اگر بخواهیم متنی که در یک DIV قرار دارد به رنگ قرمز و به صورت ایتالیک باشد می توانیم به صورت زیر کد DIV را بنویسیم:
<div style="color:red; font-style:italic">این متن قرمز رنگ و ایتالیک است.</div>
نتیجه به صورت زیر خواهد بود:
این متن قرمز رنگ و ایتالیک است.
در این روش می توانیم به هر تعداد که لازم باشد از ویژگیهای مختلف درون یک تگ HTML استفاده کنیم. به مثال زیر توجه کنید:
<div style="color:blue; font-style:italic; font-weight:bold; font-size:12pt; text-align:center">متن مورد نظر اینجا قرار می گیرد.</div>
در این مثال ما متنی را با رنگ آبی، ایتالیک، ضخیم، اندازه فونت 12pt و در وسط صفحه خواهیم داشت:
متن مورد نظر اینجا قرار می گیرد.
در قسمتهای بعدی لیستی را از ویژگیهای مختلفی که با استایل می توانیم آنها را کنترل کنیم خواهیم آورد. در اینجا فقط قصد آموزش نحوه قرارگیری استایل در تگهای HTML را داشتیم
Similar topics
» تعریف کردن استایل در بخش head صفحه HTML
» جدیدترین گوشی های وارد بازار شده
» Crash کردن سیستم
» اضافه کردن متن و تصویر
» آموزش Asp.net( کامل )
» جدیدترین گوشی های وارد بازار شده
» Crash کردن سیستم
» اضافه کردن متن و تصویر
» آموزش Asp.net( کامل )
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum
Fri Sep 18, 2009 6:50 am by tendownstreet
» نقش سویا در کاهش عوارض دوران یائسگی
Fri Sep 18, 2009 6:48 am by tendownstreet
» قطع قاعدگی به هزار و یک علت
Fri Sep 18, 2009 6:47 am by tendownstreet
» خانم ها باید مراقب باشند
Fri Sep 18, 2009 6:47 am by tendownstreet
» آنچه زنان درباره اش کمتر حرف می زنند
Fri Sep 18, 2009 6:46 am by tendownstreet
» بهبود جوش با قرص ضدبارداری
Fri Sep 18, 2009 6:45 am by tendownstreet
» عفونت های دستگاه ادراری زنان
Fri Sep 18, 2009 6:45 am by tendownstreet
» بهبود کیفیت زندگی در زنان یائسه
Fri Sep 18, 2009 6:44 am by tendownstreet
» هشت روش طلائی درمان دردهای پیش از قاعدگی
Fri Sep 18, 2009 6:44 am by tendownstreet