در این آموزش به آموزش رنگی کردن متن و همچنین تغیرات در سایز متن و رنک پس زمینه خواهیم پرداخت:
استفاده از css به ۳ صورت امکان پذیر بوده که یکی از آنها استایل دهی مستقیم به تگ ها است در ادامه مباحث پیشرفته تری در مورد css خواهیم آموخت.
<!DOCTYPE html> <html> <body> <p>متن عادی</p> <p style="color:red;">متن قرمز</p> <p style="color:blue;">متن آبی</p> <p style="font-size:36px;">متن بزرگ</p> </body> </html>
خروجی کد بالا:
تغییر رنگ پس زمینه
رنگ بک گراند بصورت پیش فرض در html سفید میباشد اما با استفاده از اتریبیوت های استایل دهی به المان ها می توان هر رنگ مورد نظری را هم به متن هم به پس زمینه صفحه بخشید.
<!DOCTYPE html> <html> <body style="background-color:lightblue;"> <h1>h1 تیتر</h1> <p>یک پاراگراف</p> </body> </html>
خروجی کد بالا:
فونت های HTML
زبان html به صورت پیش فرض از ۲ نوع فونت فارسی پشتیبانی مینماید یکی فونت arial و فونت دیگر فونت tahoma می باشد در صورت نیاز به استفاده از فونت های دیگر باید فایل فونت را به سند html پیوند دهیم که در مباحث بعدی به شکل کامل به آن خواهیم پرداخت.
<!DOCTYPE html> <html> <body> <h1>متن بدون فونت</h1> <h1 style="font-family:arial;">متن با فونت آریال</h1> <h1 style="font-family:tahoma;">متن با فونت تاهوما</h1> </body> </html>
خروجی کد بالا:
اندازه فونت متن
اندازه فونت را به کمک اتریبیوت زیر می توان به دو مقیاس پیکسلی و درصدی مشخص نمود.
<!DOCTYPE html> <html> <body> <h1 style="font-size:300%;">%با اندازه ۳۰۰ h1 سربرگ</h1> <p style="font-size:90px;">یک پاراگراف با اندازه ۹۰ پیکسل</p> </body> </html>
خروجی کد بالا:
تراز بندی متن
یک متن میتواند ۳ تراز مختلف چپ وسط و راست داشته باشد، html به صورت پیش فرض تراز چپ را دارد اما بدلیل اینکه زبان فارسی یک زبان راستچین بوده باید تراز بندی راست را برای المان ها و متون html در نظر بگیریم.
<!DOCTYPE html> <html> <body> <h1 style="text-align:right;">یک سربرگ راستچین</h1> <p style="text-align:center;">یک پاراگراف وسطچین</p> <h1>یک سربرگ چپچین </h1> </body> </html>
خروجی کد بالا:
3 دیدگاه. ثبت دیدگاه
[…] به تگ ها در آموزش قبلی به طور کامل مطرح شده برای دیدن آن اینجا کلیک […]
عالي
بسیار خوب و جالب بود…