کاربرد ویژگی style در HTML بخش چهارم
کاربرد ویژگی style در HTML بخش چهارم
سبک نمایش و ظاهر مطالب
تمام المان های HTML از مقادیر پیش فرض ظاهری برخوردار هستند. برای مثال پس زمینه سفید، رنگ متن سیاه، اندازه فونت 12 پیکسل و ….
تغییر سبک نمایش ظاهری المان های HTML با استفاده از ویژگی style انجام می شود.
در مثال زیر رنگ پس زمینه را از حالت پیش فرض که سفید است به رنگ طوسی روشن (Light Grey) تغییر می دهیم:
مثال
<body style=“background-color:lightgrey”>
<h1>تست</h1>
<p>تست.</p>
</body>
رنگ پ زمينه خاكستري مي شود.
سبک نگارش خواص ویژگی style که برای تغییر ظاهر تگ های HTML هنگام نمایش در مرورگر استفاده می شوند به روش زیر است:
منظور از خصوصیت همان ویژگی ها در CSS هستند و منظور از مقادیر خصوصیت، همان مقادیری است که برای هر ویژگی در CSS وجود دارد. در واقع ویژگی style دستورات و ویژگی های CSS را داخل تگ های HTML برای تغییر خصوصیات ظاهری آن تگ فراخوانی می کند و هر آن چه به عنوان مقادیر ویژگی style برای هر المان HTML نوشته می شود همان دستورات CSS است.
رنگ متن در HTML
خصوصیت color برای تعریف رنگ در ویژگی style در تگ های HTML استفاده می شود:
مثال
<html><body>
<h1 style=“color:blue”>تست</h1>
<p style=“color:red”>تست.</p>
</body></html>
فونت متن در HTML
خصوصیت font-family برای تعریف نوع قلم مورد استفاده برای نوشتن متن در ویژگی style در تگ های HTML استفاده می شود:
<html><body dir=“rtl”>
<p style=“font-family:tahoma”>این یک پاراگراف با فونت tahoma مي باشد.</p>
</body></html>
اندازه متن در HTML
خصوصیت font-size برای تعریف اندازه قلم در ویژگی style در تگ های HTML استفاده می شود:
مثال
<html><body>
<p style=“font-size:120%”>این یک پاراگراف با اندازه قلم 120% بزرگ تر است.</p>
<p>این یک پاراگراف با اندازه قلم پیش فرض است.</p>
</body></html>
تراز متن در HTML
خصوصیت text-align برای تعریف تراز متن (تراز متن از چپ، وسط یا راست باشد) در ویژگی style در تگ های HTML استفاده می شود:
مثال
<html><body>
<h1 style=“text-align:center”>عنوان تراز شده از وسط</h1>
<p>این یک پاراگراف است.</p>
</body></html>