طراحی سایت با ظاهری زیبا و دلخواه یکی از بخش های مربوط به طراحی سایت حرفه ای و سفارشی خواهد بود.آموزش کار با CSS یکی از جذابترین بخش های طراحی سایت است که کد نویسی در HTML وXHTML را شیرینتر می کند. در واقع سرزمین وب یک سرزمین دو زبانه است، یکی زبان ساختار نویسی وب یعنی HTML است و دیگری نمای ظاهری وب یعنی CSS می باشد.
در صورت کلی برای تعریف یک CSS خواهیم داشت:
CSS می تواند به سه صورت مورد استفاده قرار قرار گیرد.
- tag style: در داخل یک تگ در بخش محتویات <body> می توان به تگ ها فرمتی از CSS را اعمال کرد. مشکلی در این روش نمود می کند:
زمانی که تعداد پاراگرف ها زیاد و زیادتر شود، چه راه حلی برای اعمال استایلها SCC به متون می باشد؟ باید به همین شکل ادامه داد؟ یک راه حل برای رفع چنین مشکلی به نام file style وجود دارد.
- style page: استایل page تغییرات و فرمت های تعریف شده را به یک صفحه را اعمال می کند. برای این کار لازم است در قسمت <head> بعد از تگ <title> دستورات مربوط به <style> را وارد کنید.
- CSS file: در اعمال فرمت و یک قالببندی زیبا به صفحات وب از طریق style page کار جالبی به نظر نمی آید، چطور برای تمامی صفحات یک وب سایت در قسمت <head> تمامی قالب بندی را مجددا وارد کنیم تا صفحاتی یک دست و منظم با فرمتی یکسان و رنگ بندی برنامه ریزی شده ای داشته باشیم؟ این دقیقا از طریق یک فابل مجزا می تواند حاصل شود. یک CSS file برای طراحی ظاهری همه صفحات یک وب سایت تعریف می شود و ظاهر تمام صفحات را با نظم و به طور یکنواخت و یکپارچه قالبندی می کند. تصویر زیر نمونه ای از یک فایل CSS را نشان می دهد. یک فایل جدید در Notepad یا Notepad++ باز کنید و اسم آن را style بزارید و با نوع *.css آن را ذخیره کنید. نام style برای فایل CSS یک نامگذاری عمومی و رایج است. سپس مانند آنچه در تصویر می بینید به هر تگ های مورد نظر در صفحات قالب بندی و فرمت خاصی را تخصیص دهید.
زمان طراحی سایت کافی است در هر یک از صفحات وب سایت عبارت مربوط به <link> را در بخش <head> وارد کنید.