طراحی سایت در مشهد
استایل بردرهایی که شما میتوانید استفاده نمائید :
نمونه های بالا بیشتر استایل هایی را که شما میتوانید استفاده نمائید به شما نشان اعطا کرد . در زیر لیستی از مورد های مختلفی را که برای شما قابل استفاده است را آورده ایم .
ضخامت بردر :
میزان ضخامت بردر را می توان با واحد های px , pt و یا این که em به کار پیروزی .
به طور پیش فرض نیز میتوانید از کلمه ها اصلی خویش htmlبرای ضخامت دادن به بردر استفاده نمایید که مشتمل بر سه سایزو باریک ( thin ) , میانگین ( medium ) و کلفت ( thick ) است .
استایل بردر :
یک بردر قادر است هرمورد از استایل های زیر را داشته باشد :
■ solid ( میزان پیش فرض )
■ double
■ dotted
■ dashed
■ groove
■ ridge
■ inset
■ outset
رنگ بردر :
رنگ بردر نیز نظیر بقیه موادتشکیل دهنده وبسایت که به آن ها رنگ میدهیم میزان میگیرد . رنگ های خویش html که با عبارات اصلی مشخص و معلوم شده اندمثل red و هم از روش اعداد هگزا دسیمال نظیر #ff0000 .
صورت دهی و سایز دهی به عنصرها باطن وبسایت :
بیایید تا تغییرات کوچکی به پروژه سایتمان بدهیم . از عنصر body آغاز میکنیم . Style1 . css را در پروژه خویش گشوده فرمایید ( این فولدر که به موادسازنده تارنما صورت می‌دهد در تگ header به ورقه ما وصل میگردد ) و استایل های داده شده به body را نگاه فرمائید و به‌دنبال استایل های داده شده به آن بردری مانند زیر به آن بیافزایید :
BODY {
FONT - FAMILY : VERDANA , HELVETICA , ARIAL , SANS - SERIF;
BACKGROUND - COLOR : #E2EDFF;
PADDING : 15PX;
LINE - HEIGHT : 125 % ;
BORDER : 4PX SOLID NAVY;
}
نگاهی به صفحه های وبسایت خویش در مرورگر فرمایید ظواهر همه آنان می بایست نظیر صورت زیر باشد .
بیایید یه خرده تغییر تحول نیز در منوی راهبری بدهیم , پیش خیس در فصل 2 سفارش دادم که برای بخش های با اهمیت تارنما خویش از id استفاده فرمائید , ما هم در اینجا از آن خصیصه استفاده میکنیم .
design - web - 133 . jpg
در style1 . css برای منوی راهبری این مقادیر را تعریف نمایید و بعد آن را ذخیره کرده و در مرورگر آن را مشاهده کنید .
#NAVIGATION {
WIDTH : 180PX;
BORDER : 1PX DOTTED NAVY;
}
design - web - 134 . jpg
تغییر‌و تحول بعدی که می‌توانیم به منوی راهبری بدهیم background - color است , پس در پی css آی دی navigation آن را هم بیش تر میکنیم .
#NAVIGATION {
WIDTH : 180PX;
BORDER : 1PX DOTTED NAVY;
BACKGROUND - COLOR : #7DA5A8;
}
درحال حاضر منوی ما خوبتر به حیث می‌رسد , البته رنگ دور نما ای که گزینش کرده ایم منجر می گردد تا رنگ لینک و پیوند های مشاهده شده خوانایی پاره ای داشته باشند به همین منظور رنگ لینک و پیوند های مشاهده شده را تغییر‌و تحول میدهیم .
A : VISITED {
COLOR : NAVY;
}
حال خوب تر شد , در تراز آنگاه خوب تر است که به tag line بردر و رنگ بگراند بدهیم . در نمونه فوق یک تگ div بالای منو موجود هست که آی دی #tagline دارااست و درون آن یک تگ p موجود هست . پس به این ترتیب به آن استایل میدهیم :
#tagline p {
font - style : italic;
font - family : Georgia , Times , serif;
background - color : #bed8f3;
border - top : 3px solid #7da5d8;
border - bottom : 3px solid #7da5d8;
}
با انبارکردن پوشه css خویش بایستی خروجی مثل صورت زیر داشته باشید :
design - web - 135 . jpg
هم اکنون برای مشخص و معلوم شدن تگ های h1 و h2 از همدیگر , برای آن ها تفاوت قائل می شویم و بین آنها یه خرده css های متعدد درج میکنیم به دلیل آنکه استفاده از رنگ دورنما تیره برای هر دو آن ها سبب شده تا تیترهای وبسایت بیشتراز حد دارنده رنگ دور نما تیره باشند .
css های زیر را نسخه برداری کرده و در css خویش طولانی تر نمائید , به این ترتیب ظاهری نظیر تصویر زیر را می بایست در مرورگر خویش ببینید .
:: بازدید از این مطلب : 142
|
امتیاز مطلب : 0
|
تعداد امتیازدهندگان : 0
|
مجموع امتیاز : 0
عضو شوید
عضویت سریع
آمار مطالب
آمار بازدید
