ستاره غیر فعالستاره غیر فعالستاره غیر فعالستاره غیر فعالستاره غیر فعال
 

راه های وارد کردن css

سه راه برای وارد کردن یک فایل Css وجود دارد:

  • برگ سبک دهی خارجی
  • برگ سبک دهی داخلی
  • سبک درون خطی

برگ سبک دهی خارجی

یک برگ سبک دهی خارجی ایده آل ترین روش برای سبک دهی می باشد،به خصوص زمانی که قرار است

به چند برگه سبکدهی کنیم. با استفاده از برگ سبک دهی خارجی شما می توانید تمام وب سایت را فقط

با تغییر یک خط سبک دهی کنید.

 

هر صفحه ای باید برگ سبک دهی خارجی را با استفاده از تگ <link> در خود وارد کند.این تگ درون تگ head

قرار می گیرد.

 <head>

<link rel=”stylesheet” type=”text/css” href=”mystyle.css”>

</head> 

برگ سبک دهی خارجی می تواند با هر ویرایشگر متنی نوشته شود.این فایل حاوی تگ های Htmlنمی با شد.

این پرونده باید با پسوند Css ذخیره کنیم. مثل:

Mystyle.css

بین مقدار خاصیت وواحد اندازه گیری آن هیچ فاصله ای قرار ندهید.به طور مثال:

 

Margin-left: 20 px;

اشتباه بوده و

 

Margin-left: 20px;

صحیح می باشد.

 

برگ سبک دهی داخلی

زمانی از این نوع سبک دهی استفاده می کنیم که تنها یک پرونده با یک برگ سبک دهی منحصر به فرد داریم.

این برگ سبک دهی درون قسمتhead  درپروندهHtml  ودرون تگ<Style> تعریف می شود.

 

<head>

<style>

Hr {color: sienna;}

P {margin-left: 20px;}

Body {background-image: url(/“images/background.gif”);}

</style>

</head>

سبک دهی درون خطی

یک سبک درون خطی بسیاری ازمزایای استفاده از برگ های سبک دهی ندارد.این روش را فقط برای صرفه جویی

به کار ببرید.

برای استفاده از سبک دهی درون خطی،خاصیت style را درون تگ مورد نظر می نویسیم.به طور مثال در زیر رنگ

 

قرمز را با استفاده از سبک دهی درون خطی به تگ<p> اضافه می کنیم:

 

<p style=”color:red;”> this is a paragraph.</p> 

برگ های سبک دهی چند گانه

اگر برخی خواص را برای یک انتخاب گر در برگ های سبک دهی مختلف اعمال کنیم،در واقع یک خاصیت از چند

مقدار بر خورد می شود.برای فهم بیشتر به مثال زیر توجه کنید:   در فایل خارجی انتخاب گر H3خواص زیر را

اعمالکردیم:

 

H3 {

     Color: red;

     Text-align: left;

     Font-size: 8pt;

} 

ودر برگ سبک دهی داخلی خواص را برای این انتخاب گر به صورت زیر اعمال می کنیم:

 

H3 {

     Text-align: right;

     Font-size: 20pt;

} 

ولی در نهایت خواص اعمال شده به انتخابگر به صورت زیر خواهد بود:

 

Color: red;

Text-align: right;

Font-size: 20pt; 

خواهیم دید که خاصیت رنگ از برگ سبک دهی خارجی ارث برده شد و دو خاصیت دیگر از برگ سبک دهی

داخلی به ارث برده شده است.

سبک های چند گانه به یکی آبشار (cascade)می شوند!

سبک ها به صورت زیر مشخص می شوند:

درون عناصرHtml

  • درون قسمت head یک پرونده Html
  • درون یک پرونده خارجی Css

می توان چند پرونده خارجی Cssرابه یک پرونده Html رجوع داد.

 

منظور از آبشاری چیست؟

 

یک سوال: زمانی که بیش از یک سبک برای یک عنصرHtml وجود دارد در انتها کدام یک اعمال می شود؟

به طور کلی می توان گفت که همه ی سبک ها به صورت آبشاری با توجه به قانون زیر درون یک پرونده سبک

دهی مجازی ریخته می شوند که به ترتیب شماره یک اولویت کمتر وچهار اولویت بیشتری نسبت به بقیه دارد:

 سبک های پیشفرض مرورگر

برگ سبک دهی خارجی

برگ سبک دهی داخلی(درون قسمت head )

سبک درون خطی (درون عناصر Html )

 

بنابراین سبک درون خطی دارای بالاترین اولویت است. در واقع یعنی اگر از یک سبک درون خطی استفاده

کنیم،مرورگر سایر خواص موجود در دیگر برگه ها ی سبک دهی را نادیده می گیرد.

اگرتگ لینک برگ سبک دهی خارجی را بعد از تگ <head>بکار ببریم.آنگاه برگ سبک دهی خارجی اولویت

بالاترینسبت به برگ سبک دهی داخلی خواهد داشت.

 

2122

کلیه حقوق مادی و معنوی این سایت متعلق به مجتمع فرهنگی دیجیتالی فدک استان اردبیل می باشد