فونت، رنگ، سایز و سایه متن
معمولا بیشترین محتوای یک سایت را متن ها تشکیل می دهند اینجاست که اهمیت زیبا بودن متن مشخص می گردد. انتخاب یک فونت زیبا برای وبسایت می تواند باعث ماندگاری کاربران در سایت شود. رنگ بندی درست متن ها نگاه مخاطبان را نوازش می کند و سایز صحیح متن به زیبایی سایت می افزاید. این جملات کوتاه نمی تواند اهمیت سبک دهی به متن ها را توصیف کنند.
آنچه در این مقاله می خوانید ...
ویژگی های مرتبط به متن ها در css
توصیه می کنیم تمامی ویژگی های مرتبط به متن ها که در زیر آمده را خوب فرا گرفته و از آن ها نهایت بهره را در طراحی سایت خود ببرید :
ویژگی | توضیحات |
---|---|
color | رنگ متن را تنظیم می کند |
direction | راستای نوشتن متن را مشخص می کند |
letter-spacing | فاصله بین حروف را تنظیم می کند |
line-height | ارتفاع خطوط را تنظیم می کند |
text-align | تراز افقی متن را مشخص می کند |
text-decoration | دکوراسیون را به متن اضافه می کند |
text-indent | شروع خط اول در بلوک متن را مشخص می کند |
text-shadow | اثر سایه را به متن اضافه می کند |
text-transform | بزرگنمایی متن را کنترل می کند |
text-overflow | مشخص می کند که محتوای سرریز باید به کاربر نشان داده شود یا خیر |
vertical-align | تراز عمودی یک عنصر را تنظیم می کند |
white-space | مشخص می کند که چگونه فضای خالی درون یک عنصر مورد استفاده قرار می گیرد |
word-spacing | فاصله بین کلمات را در یک متن افزایش یا کاهش می دهد |
در گذشته عناصر نوشتاری در html را به شما معرفی کردیم، حال می خواهیم بدانیم چگونه می توان این عناصر را سبک داده و شکل و رنگ آن ها را به گونه ای که مایلیم تغییر دهیم.
برای سبک دهی به متون سایت ابتدا به دنبال یک فونت زیبا بگردید و آن را به سند html خود الحاق کنید. طریقه صحیح استفاده از فونت فارسی را در اینجا مشاهده کنید. سپس به صورت زیر فونت الحاق شده را به عناصری که نیاز دارید اختصاص دهید :
- element{
- font-family: family-name|generic-family|initial|inherit;
- }
حال نوبت سایز فونت عناصر نوشتاریست که به اندازه مورد نیاز تغییر کند :
- font-size:medium|xx-small|x-small|small|large|x-large|xx-large|smaller|larger|length|initial|inherit;
ویژگی های فونت در css
همچنین می توانید ویژگی های دیگری به فونت های خودتان اضافه کنید که در زیر برای شما آورده ایم :
ویژگی | توضیحات |
---|---|
font | تمام ویژگی های فونت در یک اعلامیه را تنظیم می کند |
font-family | خانواده فونت را برای متن تعریف می کند |
font-size | اندازه فونت متن را مشخص می کند |
font-style | سبک فونت متن را مشخص می کند |
font-variant | مشخص می کند که آیا یک متن باید در یک فونت کوچک نمایش داده شود یا نه |
font-weight | میزان بولد بودن فونت را مشخص می کند |
سپس رنگ متن ها را به خوبی تنظیم کرده و در صورت نیاز از ویژگی های جدول اول برای زیبا سازی سایت به درستی استفاده کنید.
توجه برای زیبا سازی متون و عمق دادن به نوشته می توانید از خصوصیت text-shadow استفاده کنید. این خصوصیت چهار پارامتر را گرفته و سایه به متن شما اضافه می کند :
- text-shadow: h-shadow v-shadow blur-radius color|none|initial|inherit;
1398/04/07
3200 بار