دوشنبه ۲۴ ارديبهشت ۹۷
به طور کلی سه راه برای اضافه کردن فایل های استایل شیت به صفحه html وجود دارد :
در این روش استایل های هر المنت داخل تگ html نوشته میشوند .
1-روش inline :
در این روش استایل های هر المنت داخل تگ html نوشته میشوند.
<h1 style="color:blue;">This is a sample text</h1>
در این مثال استایل تعریف شده فقط به این تگ تعلق میگیرد و به باقی تگهای h1 اعمال نمی شود .
استفاده از این روش زیاد توصیه نمیشود به دلیل اینکه علاوه بر بهم ریختگی کدهاوافزایش حجم صفحات تاثیر منفی بر سئوی سایت دارد.
2- روش internal :
در این روش تمامی کدهای css مربوط به صفحه در تگ <head> ودر داخل تگ <style> نوشته میشوند. در این روش تمامی استایل ها فقط یه صفحه جااری اعمال ممیشوند.
مثال:
<!DOCTYPE html>
<html>
<head>
<style>
{;body {background-color: red
{;h1 {color: blue
{;p {color: red
<style/>
<head/>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
<body/>
<html/>
3- روش اکسترنال :
بهترین و رایج ترین روش اضافه کردن فایل css به صفحه روش خارجی یا اکسترنال میباشد. در این روش استایل ها در یک فایل جدا با پسوند css نوشته میشوند و در نهایت لینک آن در هدر صفحه گذاشته میشود .در این روش میتوان یک فایل css را به چند صفحه اعمال کرد.بهترین و رایج ترین روش اضافه کردن فایل css به صفحه روش خارجی یا اکسترنال میباشد. در این روش استایل ها در یک فایل جدا با پسوند css نوشته میشوند و در نهایت لینک آن در هدر صفحه گذاشته میشود .در این روش میتوان یک فایل css را به چند صفحه اعمال کرد .
<head>
<link rel="stylesheet" href="styles.css">
<head/>
منبع : http://pzof.ir