طراحی سایت با CSS با 4 درس آموزشی
اگر قصد ساختن یک سایت را دارید، باید هم HTML و هم CSS را یاد بگیرید. HTML یک زبان برنامه نویسی است که به عنوان پایه ای برای توسعه وب سایت عمل می کند. زبان دیگری که باید یاد بگیرید، CSS است. یادگیری CSS به شما کمک می کند تا بهترین طراحی یا سبک را برای وبسایت تان ایجاد کنید.
بعد از خواندن این مقاله، می توانید بفهمید که CSS چیست و چه طور می توانید این زبان را در وبسایت تان پیاده سازی کنید.
CSS چیست و چه ارتباطی با HTML دارد؟
CSS مخفف عبارت Cascading Style Sheets است. معمولا به روشی برای این که بتوانید به وبسایت تان سبک بدهید، گفته می شود. معمولا HTML می تواند برای ساختار سند وب مثل پاراگراف ها یا سر فصل ها استفاده شود اما CSS به سندتان استایل می دهد. شما می توانید از CSS برای تعیین چیدمان، فونت ها و رنگ ها استفاده کنید.
شما می توانید HTML را به عنوان زبان پایه وب سایت و CSS را می توان به عنوان ابزاری برای زیباتر کردن آن در نظر بگیرید . شما باید از CSS برای ایجاد سبک خاصی برای وب سایت یا صفحه وب تان استفاده کنید . برای طراحی بهتر وبسایت تان باید هم از HTML و هم CSS استفاده کنید.
CSS چه طور کار می کند؟
CSS با تعامل با برخی از عناصر HTML استایلی را به صفحات وب اضافه می کند. یکی از این عناصر پاراگراف ها هستند. اگر می خواهید که یک پاراگراف ظاهری پر رنگ داشته باشد، می توانید از کد CSS به شکل زیر استفاده کنید :
p { font-weight:bold; }
در مثال بالا، p به پاراگراف اشاره خواهد کرد و انتخاب گر نامیده می شود. در این قسمت، سیستم CSS مشخص می کند که کدام عنصر HTML در استایلسازی CSS بر ظاهر کل وب سایت تأثیر بگذارد.
چرا باید از CSS استفاده کنید؟
استفاده از CSS مزایای متعددی دارد . به خاطر همین مزایا ، استفاده از CSS به تمام طراحان وب سایتی که می خواهند بهترین سبک را برای وبسایت شان ایجاد کنند، توصیه می شود.
حتما دانلود کنید: آموزش طراحی سایت از صفر تا صد (16 درس رایگان)
آ: یک مشکل بزرگ را برطرف می کنید
قبل از توسعه CSS، هر برچسبی مثل سبک پس زمینه، رنگ، فونت ، چینش عناصر، اندازه و حاشیه باید برای هر صفحه تکرار می شد. این فرآیند برای توسعه وب سایت خسته کننده و طولانی خواهد بود. اگر قصد دارید که یک وب سایت جدید ایجاد کنید، زمان زیادی از شما خواهد گرفت . به همین خاطر در حال حاضر از CSS استفاده می شود. این زبان این مشکل بزرگ که برای بسیاری از طراحان وب سایت از سراسر جهان رخ می دهد را حل می کند.
ب: در زمان تان صرفه جویی کنید
شما مجبور نیستید کد تک تک صفحات وبسایت تان را ویرایش کنید. فقط باید تغییراتی در CSS ایجاد کنید، مخصوصا اگر بخواهید کل وب سایت را تغییر بدهید. یعنی با جایگزینی برخی از کد ها در یک صفحه در وقت و انرژی تان هم واقعا صرفه جویی خواهد شد.
ج : قابلیت های بیشتری را به وبسایت اضافه کنید
اگر بخواهید یک سری ویژگی ها را به وب سایت خود اضافه کنید، می توانید به جای HTML از CSS استفاده کنید. CSS از ویژگی های زیادی برای طراحی وبسایت تان استفاده می کند، بنابراین می توانید شکل و ظاهر خوبی به سایت تان بدهید. راه های مختلفی وجود دارد که می توانید کدCSS تان را بر اساس نیازتان سفارشی کنید . CSS اگر بخواهید ظاهر کلی وبسایت تان را راحت و به سرعت شخصی سازی کنید، دست تان را باز می گذارد.
3 راه اصلی برای افزودن کد CSS به صفحات HTML وجود دارد . کد CSS می‌تواند به صورت خارجی، درون خطی یا داخلی نوشته شود. شیوه نامه های خارجی معمولا به صورت فایل ذخیره می شوند . می توان از آن ها برای تعیین ظاهر کل وب سایت شما از طریق یک فایل استفاده کرد.
دانلود کنید: آموزش صفر تا صد سی اس اس
Internal Style Sheets یا شیوه نامه های داخلی در واقع دستورالعمل های CSS هستند که در هِدِر یک صفحه خاص نوشته می شوند. نمونه ای از این دستورالعمل ها ممکن است زمانی اعمال شوند که یک رنگ پس زمینه اضافه و رنگ فونت را برای محتوای تان انتخاب کنید .
Inline-style ها تکه هایی از CSS هستند که مستقیما روی کد HTML نوشته می شوند.
ویدیوی آموزشی
دانلود کنید: آموزش صفر تا صد اچ تی ام ال
