CSS How To

خدمات طراحی سایت
طراحی و اجرای شبکه های کامپیوتری در کرمانشاه و شهرستانهای تابعه
انجام پروژه های دانشجویی
آموزش های طراحی وب
آموزشهای شبکه

CSS How To...

چگونگی عملکرد Css
هنگامی که مرورگر یک style sheet را می خواند، فرمت اسناد را بر اساس آن، تنظیم می کند.و اینم مهمترین دلیل استفاده از فایل های css است .
سه راه برای وارد کردن یک CSS وجود دارد:
• Style sheet خارجی
• Style sheet داخلی
• Style درون خطی
External Style Sheet
Style sheet خارجی
یکی از روشهای تعریف css استفاده از روش External Style Sheet میباشد.
یک CSS خارجی زمانی کارایی دارد که آن استایل شیت در بیشتر صفحات استفاده شود. با یک CSS خارجی شما می توانید ظاهر یک سایت را تنها با تغییر دادن یک خط کد در آن استایل شیت خارجی تعریف شده تغییر دهید. هر صفحه باید با استفاده از برچسب link ، به style sheet لینک شود. برچسب link در داخل بخش head قرار می گیرد.
طریقه استفاده از استایل شیت خارجی به صورت زیر می باشد :

بهینه ترین روش استفاده از استایل شیت استفاده از استایل شیت خارجی است .

• قوانین نام گذاری css
1. استفاده از کاراکترهای خاص ممنوع.کاراکترهای مجاز :حروف a-z ، اعداد 0-9 ، خط زیر (_) ، خط فاصله (-)
2. از کاراکتر space استفاده نکنید.
3. نام فایل را با یک حرف شروع کنید نه با عدد.
4. برای نام گذاری فایل ترجیحا از حروف کوچک استفاده کنید.
Internal Style Sheet
Style sheetداخلی
یک CSS داخلی باید هنگامی استفاده شود که بخواهیم در یک فایل از یک style sheet منحصر به فرد استفاده کنیم.
Style داخلی را باید با استفاده از تگ style در قسمت head کد html تعریف کنیم.
مزایای استفاده از این سبک :
• تنها بر روی صفحاتی که از این سبک استفاده کرده اند تاثیر میگذارد.
• بر خلاف سبک درون خطی ، این روش میتواند از خاصیت ارث بری کلاس ها استفاده کند.برای مثال میتوانید از یک Style در چندین جای همان صفحه اسفاده کنید.
• این سبک اولویت بالاتری از CSS خارجی ها داشته باشند.
معایب استفاده از این سبک :
• تنها در صفحاتی که در آن هستند تاثیر میگذارند.
• افزایش زمان بارگزاری صفحه
Inline Styles
style درون خطی برای استفاده از سبک درون خطی شما باید خصوصیات را در تگ مورد نظر قرار دهید، خصوصیات styleها می توانند هر کدام از مشخصات CSS را شامل بشوند.

این یک پاراگراف است .

سبک درون خطی Inline
این روش دارای بالاترین اولویت اجرا نسبت به دو روش دیگر است.
Multiple Style Sheets
Style sheet های چندگانه اگر یکسری خصوصیات مختلف را برای یک انتخابگر در stylesheet های مختلف در نظر بگیریم ،انتخابگر خصوصیات خود را از خصوصی ترین style sheet به ارث می برد.
برای مثال انتخابگر h3 را با خصوصیات زیر در یک styel sheet خارجی درنظربگیرید:

و خصوصیات زیر را برای همان انتخابگر h3 در style sheet داخلی در نظر بگیرید:

برای صفحه ای که هم به style sheet خارجی لینک شده است و هم دارای style sheet داخلی است، خصوصیات زیر اعمال می شود:

color از style sheet خارجی و text-align و font-size از style sheet داخلی به ارث برده شده اند.
تجمع چند style در یک جا
Styleها می توانند در جاهای زیر مشخص شده و قرار بگیرند:
• در عناصر html
• در قسمت head یک صفحه ی html
• در یک فایل css خارجی
نکته: در یک فایل html می توان به چند style sheet خارجی اشاره کرد.
ترتیب آبشاری
خصوصیاتی که به صورت درون خطی (inline) تعریف میشوند برتری دارند (اولویت بالاتری دراجرا دارند) نسبت به خصوصیاتی که در style sheetهای داخلی یا style sheetهای خارجی تعریف میشوند.
نکته: اگر لینک به style sheet خارجی بعد از تگ style در قسمت head کد html قرار بگیرد، اولویت بالاتری در اجرا نسبت به style sheet داخلی خواهد داشت.

برچسب مطالب :
css چیست| قواعد نوشتاری زبان css | کلاس و id در css| چگونگی عملکرد css| تنظیم پس زمینه background در css | متن در css| فونت در css | لینک ها در css | لیستها در css | جداول در css| باکس Box Model در css | ویژگی css border | ویژگی css outline| ویژگی css margin | ویژگی css padding | گزینشگرهای گروهی در Css | خاصیت css dimension | خاصیت css display | خاصیت css position | خاصیت css floating | خاصیت css align | شبه کلاسها در css | شبه عناصر در css | نوار هدایت در css | گالری تصاویر در css| ایجاد تصاویر شفاف در css| خاصیت image sprites در css | انواع رسانه ها در css | انتخاب گرها در css| معرفی css3| حاشیه در css3| پس زمینه در css3| خاصیت css3 gradients| جلوه های متن در Css3| فونت در css3| تغییر شکل های 2 بعدی در css3| ترنسفرم های سه بعدی در css3 | خاصیت css3 transitions | انیمیشن در css3 | ستونهای چند گانه در css3 | رابط کاربری css3 |

css چیست
قواعد نوشتاری زبان css
کلاس و id در css
چگونگی عملکرد css
تنظیم پس زمینه background در css
متن در css
فونت در css
لینک ها در css
لیستها در css
جداول در css
باکس Box Model در css
ویژگی css border
ویژگی css outline
ویژگی css margin
ویژگی css padding
گزینشگرهای گروهی در Css
خاصیت css dimension
خاصیت css display
خاصیت css position
خاصیت css floating
خاصیت css align
شبه کلاسها در css
شبه عناصر در css
نوار هدایت در css
گالری تصاویر در css
ایجاد تصاویر شفاف در css
خاصیت image sprites در css
انواع رسانه ها در css
انتخاب گرها در css
معرفی css3
حاشیه در css3
پس زمینه در css3
خاصیت css3 gradients
جلوه های متن در Css3
فونت در css3
تغییر شکل های 2 بعدی در css3
ترنسفرم های سه بعدی در css3
خاصیت css3 transitions
انیمیشن در css3
ستونهای چند گانه در css3
رابط کاربری css3