آموزش کار با استایل (CSS)

CSS یا همان Cascading Style Sheet روشی است برای قالب بندی و طراحی اجزای صفحه از قبیل متن، تصویر، زمینه صفحه، کادرها و تقریباً هر چیزی که در طراحی صفحه استفاده می شود بدون استفاده از کدهای HTML. از طریق این استایل شیتها می توانیم از دوباره نویسی کدهای HTML که باعث مشکل شدن کد نویسی و همچنین کند شدن سرعت بارگذاری صفحه در اینترنت می شود جلوگیری کنیم. برای مثال می توانیم یک بار نوع فونت مورد استفاده در یک صفحه را تعیین کنیم و دیگر مجبور نباشیم کد مربوط به فونت را در صفحه به کار ببریم. همچنین می توانیم از این ابزار قدرتمند در مواردی به جای جاوا اسکرپت نیز استفاده کنیم و چون مشکلات جاوا اسکرپت مثلاً غیر فعال بودن جاوا اسکرپت در مرورگر را ندارد با خیالی آسوده تر می توانیم از آن استفاده کنیم.

CSS هم مانند جاوا اسکرپت این امکان را به ما می دهد که از یک فایل استایل خارجی برای تعیین خواص بخشهای مختلف صفحه های یک سایت استفاده کنیم. در این صورت می توانیم ظاهر همه صفحه ها را با ایجاد یک تغییر کوچک در فایل استایل خارجی تغییر دهیم. مثلاً فرض کنید که رنگ متن همچنین نوع فونت متن صفحه هایمان را در یک فایل استایل تعیین کرده ایم و از آن در طراحی چندین صفحه استفاده کرده ایم، حالا اگر بخواهیم رنگ متن همه این صفحات را تغییر دهیم تنها کافی است تا رنگ متن را در همان فایل استایل تغییر دهیم و نیازی به تغییر دادن صفحات نداریم.

در این قسمت به معرفی قابلیتهای مختلف CSS خواهیم پرداخت . چون این قسمت در سایت ما به تازگی راه اندازی شده است هنوز کامل نشده و به مرور زمان سعی می کنیم آنرا کاملتر کنیم.

اگر انتقاد یا پیشنهادی برای بهتر شدن این قسمت دارید می توانید از طریق «فرم تماس با ما» ما را مطلع کنیم. ما نیز خوشحال می شویم از نظرات شما در جهت بهبود این بخش استفاده کنیم.


نظرات بازدید کنندگان
Tue, 19 May 2009 17:51:41 +0430 نویسنده : مریم
سلام خسته نباشید من یه پروزه طراحی وب دارم.میخواستم بدونم میتونین به من کمک کنید تا وب سایتم رو به استادم تحویل بدم یا نه؟همیشه دعاتون میکنم
 
Tue, 19 May 2009 17:45:24 +0430 نویسنده : لیلا
با سلام خدمت دوستان عزیز من می خوام وب سایتی  طراحی کنم که از صفحه اول به صفحه بعدی بره اگه بشه کد رو  به ایمیلم بفرستید.خیلی ممنون میشم
 
Fri, 15 May 2009 13:26:46 +0430 نویسنده : حمید
سلام و خسته نباشید خدمت شما دوست عزیز من یک فرم می خواستم که افراد بازدید کننده از سایتم بتونن برام نظراتشون رو از طریق ایمیلم ارسال کنن میشه این کد رو برام به ادرس جیمیل بفرستید.یک دنیا ممنون اگر این کار بزرگ را برا ی بنده انجام بدهید
 
Tue, 05 May 2009 13:17:13 +0430 نویسنده : سعد
@ پویا :
این کار با کدهای HTML ویژۀ مرورگرهای Mozilla (مانند فایرفاکس) ممکنه. من اونو تو وبلاگم اعمال کردم.
کدش اینه: -moz-border-radius: 3px

@ فاطمه :
از HTML باید شروع کنی. یکم که یاد گرفتی در کنارش CSS هم کار میکنی، و بعد HTML و CSS رو در کنار هم پیشرفته تر یاد میگیری.
 
Mon, 04 May 2009 18:53:08 +0430 نویسنده : مژده
با سلام و خسته نباشيد ،من يك سوال درباره Cssو html دارم:
من فايل  html را در Notepad  مي نويسم و براي اينكه xhtmlهم Support شود دستور زير را مي نويسم:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 EN" "http://www.w3c.org/TR/xhtml1-strict.dtd">

در notepad مجدد css را مي نويسم اما گويا اين دو فايل با اينكه هر دو در يك جا هستند و دستور لينكش را نيز داده ام هيچ گونه عملي روي دستورات <p>انجام نمي دهد
دستورم در html به فرم زير است:
<head><title>Home</title><link href="home.css" type="text/css" rel="stylesheet"/></head>
<p id="GOL">Welcome</P>
و دستورم در Css به فرم زير :
#GOL{font-family:Tahoma;color:red;}
تنها موردي كه بايد ذكر شود من برنامه frontpage ندارم آيا مي تواند بدين دليل باشد كه دو فايل يكديگر را نشناسند؟ضمنا IE7دارم.
 
Thu, 23 Apr 2009 00:00:26 +0430 نویسنده : مهدی
کل CSS تو همین چند خط تموم شد!!!؟؟؟ خیلی کم بود بابا. اصلاً هیچی نداشت. اگه اینجوری بود که همه متخصص CSS میشدند. اصلاً کامل نبود. امیدوارم بعداً دست و دل بازتر بشی
 
Fri, 17 Apr 2009 13:29:03 +0430 نویسنده : ناهيد
مطالب مربوط به css عالي بود خيلي بهم كمك كرد چون براي طراحي وب بهش نياز داشتم ازت متشكرم
 
Thu, 09 Apr 2009 15:36:16 +0430 نویسنده : سارا
سلام، ممنون از زحمات و آموزش شما. یه نکته کوچیک: اگر آخر هر درس لینک به صفحات بعدی وجود داشته باشه آدم احساس نمیکنه که دیگه صفحه دیگه ای وجود نداره، برای من که تازه وارد هستم اینطوری بود. می بخشید البته جسارت بود.
موفق و سربلند و سلامت باشید.
 
Wed, 08 Apr 2009 14:59:35 +0430 نویسنده : fatemeh mahmodkhani
amozeshesh kamel tozih dade nashode
 
Tue, 07 Apr 2009 08:04:17 +0430 نویسنده : masuod
سلام.
عارضم به حضور شما که من یه پروژه طراحی صفحه وب دارم . میخواستم بدونم میتونین بهم کمک کنین تا یه صفحه وب با یه طراحی مناسب تحویل استادم بدم یا نه؟
 
Sun, 05 Apr 2009 17:56:13 +0430 نویسنده : ملک فیصل منزجر
سلام من هم علاقه خیلی خیلی زیاد به طراحی وساخت سایت دارم میشه بیشتر توضیح دهید ممنون تان
 
Sat, 04 Apr 2009 00:07:21 +0430 نویسنده : جعفری
سلام
من میخوام سایت طراحی کنم میشه راهنمائیم کنید
با تشکر
 
Thu, 02 Apr 2009 01:03:48 +0430 نویسنده : golizade
سلام:
استاد اگر لطف كنيد اصطلاحات اشاره شده در اموزش طراحي سايت بيشتر توضيح دهيد  ممنون
ميشوم.
                                                                                                 golizade       مرسي
 
Wed, 18 Mar 2009 15:01:15 +0330 نویسنده : محمد نويد
سلام محمد نويد هستم ازخدمات شما تشكر ميكنم
 
Fri, 13 Mar 2009 15:44:51 +0330 نویسنده : فاطمه
سلام
من ميخوام ياد بگيرم چطوري سايت طراحي كنم.ميشه بهم بگيداز كجا بايد شروع كنم؟
ممنونم
 
Sun, 08 Mar 2009 07:38:23 +0330 نویسنده : حمید وحدانی
با عرض سلام و با عرض سپاس از زحمات شما
به نظر من توصیفی برای زحمات و زیباییهای کار شما را با نوشتن نمی توان بیان کرد.
فقط میتوان گفت دست مریزاد ، بینهایت سپاس و امیدوارم این مطالب را ادامه و همیشه موفق و کامروا باشید
 
Thu, 05 Mar 2009 21:53:31 +0330 نویسنده : اشكان انوشه
آقا واقعا خیلی دستتون درد نکنه ، خیلی باحالید!!!
 
Fri, 27 Feb 2009 14:00:28 +0330 نویسنده : پویا
درود
من قالب سایتم رو با جدول های html طراحی کردم
ولی لبه های چهار گوشه ی جداولم نوک تیز هستش و از زیبایی سایتم کم کرده.
آیا راهی هست در html یا Css که گوشه های جدول رو مانند سایت شما حالت مورب یا گرد مانند کنم؟

ممنون میشم اگه راهنمایی کنید.
روز خوش
 
Thu, 26 Feb 2009 21:53:51 +0330 نویسنده : arash
salam
اگر خواسته باشیم فایلی که با
html
نوشتیم رو با cpanel اپلود کنیم / چکار باید کرد
همچی توضیح بده یک کم شیر فهم بشیم
 
Thu, 19 Feb 2009 01:14:21 +0330 نویسنده : مهدي محمدي نژاد
من سایتمو با  cms رایگان ورد پرس پیاده سازی کردم ودر عرض یک ماه به 2000 بازدید روزانه رسیدم ولی راضی نیستم اطلاعاتم در مورد طراحی سایت صفر است میخواهم یاد بگیرم مخصوصا طراحی سیستم مدریت محتوا ولی نمیدانم از کجا شروع کنم لطفا کمکم کنید