خانه » کاربردی » آموزش و کتاب الکترونیکی » آموزش HTML به زبان ساده – قسمت ششم – مقدماتی

دسته

مطالب تصادفی

آموزش و کتاب الکترونیکی

آموزش HTML به زبان ساده – قسمت ششم – مقدماتی

به نام خدا

 

با عرض سلام و وقت بخیر خدمت مشاهده کنندگان وبسایت وان پی سی

طبق روال آموزش های قبلی ، امروز به قسمت سَبک دهی یا همان استایل دادن به متون در خدمت شما هستیم

امیدوارم مورد پسندتون باشه !

 

سَبک دهی یا استایل :

تمامی عناصر و تگ های در HTML بصورت پیش فرض برای خود یک استایل دارند(پس زمینه ی سفید با رنگ فونت سیاه)

برای تغییر این استایل میتوان از عنصر استایل (Style) استفاده کرد (در مثال به طور کامل توضیح میدهیم)

 

یک مثال برای تغییر رنگ پس زمینه از پیشفرض(سفید) به قرمز :

 

<body style=”background-color:lightgrey”>

<p> این متن با پس زمینه ی قرمز نمایش داده می شود </p>

</body>

 

نوشتن یک استایل :

 

برای نوشتن یک استایل بطور پیشفرض باید به شکل زیر عمل کرد :

style=”property:value”

style = نوشتن این کلمه برای استایل دهی یا فرم دهی الزامی است

property = انتخاب یک ویزگی یا خصوصیت خاص(که ما در اینجا برای مثال از background-color استفاده کردیم )

value = انتخاب یک مقدار برای آن خصوصیت یا ویژگی (که ما برای مثال از رنگ قرمز استفاده کردیم)

 

خصوصیت و مقدار یکی از توانایی های  CSS هستند (CSS هم را بعدا باهم به آموزش ان می پردازیم)

 

 

رنگ متون :

 

برای استایل دادن رنگی به متون باید از خصوصیت color استفاده شود

 

 به این شکل :

 

<h1 style=”color:blue”>متن آبی
<p style=”color:red”>متن قرمز</p>
فونت متون :
برای استایل دادن به فونت و زیبایی در نوشتار و نمایش ، شما باید از خصوصیت font-family استفاده کنید
به این شکل :
<h1 style=”font-family:arial”>یک متن با فونت آریال
<p style=”font-family:tahoma”>یک متن با فونت تاهوما</p>

 

 

اندازه متون :

 

برای انتصاب اندازه به متون باید از خصوصیت font-size استقاده کرد

 

به این شکل :

 

<h1 style=”font-size:300%”>این یک متن با سایز 300 برابر است
<p style=”font-size:160%”>این یک متن با سایز 160 برابر است</p>
تراز بندی متون : 
برای تراز بندی و هدایت متون در صفحه سند خود و برای نمایش در مرورگر میتوانید از خصوصیت Align استقاده کنید
به این شکل :
<h1 style=”align:center”> یک متن وسط چین 
<p style=”align:right”> یک متن راست چین </p>
به امید دیدار و موفقیت شما بازدید کنندگان

 

0 0 رای ها
Article Rating

آموزش HTML به زبان ساده – قسمت ششم – مقدماتی

0
افکار شما را دوست داریم، لطفا نظر دهید.x