اين همان جواب سوال بالاست . با exteal مي توانيد يک استايل را براي تمام صفحات داشته باشيد و فقط کافي است اين فايل را به صفحه مورد نظر وصل کنيد .
البته دلايل بيشتري هم براي انتخاب exteal وجود دارد که در دوره پيشرفته خواهم گفت .
نحوه ساخت يک Exteal CSS:
اديتور خود را باز نماييد و متن css خود را در آن بنويسيد
/*
CSS for Bubble Under site
*/
p {
font-weight: bold;
color: blue;
}
سپس فايل را با نام style1.css ذخيره کنيد همان طوري که فايل html را ذخيره نموديد . حالا مي بايست فايل ساخته شده را به صفحه متصل نماييد.
نکته : فوايد استفاده از کامنت در css همانند html مي باشد و براي تفکيک کد هاي css در پروژه هاي بزرگ و گروهي استفاده مي شود. براي اين منظور از عبارت زير استفاده مي کنيم :
/* comment hear */
اضافه کردن exteal css به صفحات html:
براي اين کار از عنصر link داخل تگhead استفاده مي کنيم بدين ترتيب:
<head>
<title>Bubble Under - The diving club for the south-west
UK</title>
<meta http-equiv="Content-Type"
content="text/html; charset=utf-8"/>
<link href="style1.css" rel="stylesheet" type="text/css"/>
</head>
Href به فايل css شما اشاره مي کند . عناصر rel , type به مرورگر بيان مي کند نوع لينک شما چيست تا مرورگر محتواي صفحه را طبق آن تنظيم کند .
نکته : عنصر لينک يک تگ empty است و نمي توان آن را در Xhtml به صورت container نوشت .
پس نتيجه مي گيريم که exteal css در طراحي سايت ها از همه مناسب تر است و تنها در مواردي مجبوريم که از inline و يا embedded استفاده کنيم . براي اين که درک اين مطلب براي شما ساده تر باشد به سايت خودم يک سري بزنيد و سورس 2 و يا 3 صفحه آن را مشاهده نماييد(براي ديدن تصوير بزرگ روي هر نصوير کليک کنيد) :
صفحه اول :
design-web-54.gif
صفحه دوم:
design-web-55.gif
ميتوانيد ببينيد که همه صفحات به يک css وصل شده اند.
اگر به 2 تصوير بالا دقت کنيد و يا سورس وب سايت را ببينيد ، متوجه عنصري به نام media خواهيد شد.
به طور خلاصه اين عنصر براي هدف قراردادن سي اس اس براي مدياي خاص مثل screen و يا موبايل و يا مثلا ظاهر صفحه در زمان پرينت است. مثل هميشه توصيه ميکنم در اين مورد بيشتر تحقيق کنيد.
نکته :
آدرسي که در مثال بالا براي css مشاهده مي فرماييد يک آدرس دهي مطلق است که استفاده از آن بري شما ضرورتي ندارد . يعني اگر فايل css شما کنار فايل html شماست بايد از روش زير استفاده نماييد :
<link href="style1.css" rel="stylesheet" type="text/css"/>
در جلسه آينده وارد بحث css مي شويم و نحوه نوشتن استايل براي عناصر مختلف صفحه را مررور مي کنيم.
مثل هميشه منتظر نظرات انتقادات و البته پيشنهادات شما هستم و اين کامنت ها و هم چنين استقبال شماست که ما را به ادامه کار
دلگرم خواهد کرد .
برچسب: طراحی وب سایت,طراحی سایت,طراحی و,
نویسنده: yoosef
تاريخ: شنبه
8 تير
1392 ساعت: 12:24