Loading...
آموزش نحوه استفاده از دستورات CSS در HTML
احتمالا اطلاع دارید که CSS در لایه دوم وب کار می کند و بدون لایه متحوا (HTML) هیچ است، از این رو، لازم است که دستورات CSS و HTML را باهم ارتباط دهیم. به سه روش می توان دستورات CSS را به یک صفحه وب (صفحات HTML) معرفی کرد که شامل روش های زیر می باشد:
.
برگه های سبک خارجی (External Style Sheet): این نوع سبک استفاده از CSS زمانی موثر است که اگر خواسته باشید یک استایل را بالای چندین صفحه HTML تطبیق کنید که با این روش تنها با تغییر دادن یک فایل استایل کلی صفحه را تغییر می کند.
.
در این سبک دستورات CSS در یک فایل مجزا با پسورند .css ذخیره شده و این فایل به تمامی صفحات HTML که می خواهید استایل بالای آن تطبیق شود لینک میدهیم. شما می توانید برای این کار از تگ Link که که جز تگ های تهی است استفاده کنید. البته باید یادآور شد که این Link باید در بین تگ Head نوشته شود.
توضیحات بیشتر در ادامه مطلب ….
.
<head> <link rel=”Stylesheet” type=”text/css” href=”Style.css”> </head>
نکته: در تگ Link بالا صفت rel نوع رابطه صفحه CSS را مشخص می کنید که همیشه قیمت آن برابر به Style sheet می باشد. Type نوعیت سند را که ارتباط میدهد و مشخص می کند و href هم عبارت از همان سند مجزاء css تان می باشد.
روشی دیگری نیز برای ایجاد ارتباط یک سند CSS با سند HTML می باشد و آن هم استفاده از قانون @import همراه با تگ style می باشد.
به عنوان مثال فایل Stylee.css را به صورت زیر با فایل HTML ملحق می کنیم.
<Style type=”text/css”> @import url (style.css) </style>
برگه های سبک داخلی (Internal Style sheet) :
این روش معمولاً وقتی استفاده میشود که خواسته باشید که هر صفحه استایل مجزاء داشته باشد.
این روش با تگ style در بین تگ Head اجرا می شود.
<head> <Style type=”text/css”> div{background :#fff; Font-size:20px; Width:180px;} </style> </head>
برگه های سبک داخلی (Internal Style sheet) :
در این حالت استایل ها تنها در یک تگ مربوط که با style آغاز شده تطبیق میگردد البته استفاده از این روش تنها در موارد خاصی میتوان استفاده کرد در غیر آن استفاده از این روش پیشنهاد نمی شود.
<p style=”background-color:”red”;color:yellow> this is a paragraph </p>