سی اس اس

سازگاری مرورگرها با CSS

نویسنده: فرزاد ربیعی
تاریخ: ۳اردیبهشت ام ۱۳۹۱
دسته بندی: CSS طراحی سایت
سازگاری مرورگرها با CSS

در این ده جلسه، کدهای مختلفی که برای طراحی سایت در CSSوجود دارد، دوره شد. ولی مشکلی که شاید تا الان به آن برخورد کرده باشید، این است که کدهای CSS در همه مرورگرها طبق خواست ما عمل نمی کنند. شما انتظار دارید مثلا وقتی از کد outline در CSS استفاده می کنید، حاشیه ای […] ادامه متن »

آموزش CSS – جلسه دهم – کلاس های کاذب و list-style

نویسنده: فرزاد ربیعی
تاریخ: ۲۱فروردین ام ۱۳۹۱
دسته بندی: CSS طراحی سایت
آموزش CSS – جلسه دهم – کلاس های کاذب و list-style

کلاس های کاذب یا pseudo برای تغییر رفتار تگ های دیگر به کار می روند. یکی از کاربردهایش استفاده از آن در ساخت منوها است. این کلاس ها را نمی توان به طور مستقیم در خاصیت style نوشت و برای استفاده از آن ها یا باید در یک فایل CSS آن را نوشت یا بین […] ادامه متن »

آموزش CSS – جلسه نهم – background

نویسنده: فرزاد ربیعی
تاریخ: ۲۷اسفند ام ۱۳۹۰
دسته بندی: CSS طراحی سایت
آموزش CSS – جلسه نهم – background

background با این خصوصیت می توانیم پس زمینه صفحات وب و همینطور هر تگ، باکس و … را مشخص کنیم. برای background می توانیم رنگ یا عکسی خاص در نظر بگیریم. همین طور می توانیم یک عکس را در background تکرار کنیم که قابلیت مناسبی برای طراحی صفحات وب می باشد. برای کار با background، […] ادامه متن »

آموزش CSS – جلسه هشتم – position, float, z-index

نویسنده: فرزاد ربیعی
تاریخ: ۱۷اسفند ام ۱۳۹۰
دسته بندی: CSS طراحی سایت
آموزش CSS – جلسه هشتم – position, float, z-index

float: برای این که بتوانیم یک المنت را در سمت چپ یا راست صفحه قرار دهیم، می توانیم از آن استفاده کنیم. مانند مثال زیر که اگر float را به کار نمی بردیم، در سمت چپ قرار می گرفت. در صفحه html: در صفحه CSS که خروجی به صورت شکل زیر است ادامه متن »

آموزش CSS – جلسه هفتم – border, outline, margin, padding

نویسنده: فرزاد ربیعی
تاریخ: ۱۷اسفند ام ۱۳۹۰
دسته بندی: CSS طراحی سایت
آموزش CSS – جلسه هفتم – border, outline, margin, padding

border: برای این که بخواهید در طراحی وب سایت حاشیه داشته باشید، از آن استفاده می کنید. در حاشیه سه آیتم وجود دارد. border-type: نوع خط حاشیه را مشخص می کند که شامل مقادیر زیر است: none, hidden, dotted, dashed, solid, double, groove, ridge, inset, outset یکی از border-type های پر استفاده، solid است. خاصیت […] ادامه متن »

آموزش CSS – جلسه ششم – font – color – text-align

نویسنده: فرزاد ربیعی
تاریخ: ۱۳اسفند ام ۱۳۹۰
دسته بندی: CSS طراحی سایت
آموزش CSS – جلسه ششم – font – color – text-align

برای مشخص کردن فونت، از تگ font-family استفاده می کنیم. در صفحه html: در صفحه css: ابتدا ویژگی font-family که برای معرفی فونت به کار می رود را نوشته و سپس مقدارش را می نویسیم. یکی از فونت های مناسب فارسی در صفحات وب، Tahoma است. font-size: برای مشخص کردن سایز نوشته، از این تگ […] ادامه متن »

آموزش CSS – جلسه پنجم – width, height, div, id, class, overflow

نویسنده: فرزاد ربیعی
تاریخ: ۹اسفند ام ۱۳۹۰
دسته بندی: CSS طراحی سایت
آموزش CSS – جلسه پنجم – width, height, div, id, class, overflow

یک صفحه وب از آیتم های کوچک تر درست شده که معمولا برای این که بتوانیم تسلط بیشتری روی صفحه وب داشته باشیم، به آن آیتم ها عرض و ارتفاع می دهیم. هر سایت بنا بر خدماتی که ارائه می دهد و همین طور طراحی سایتش، آیتم های بیشتر یا کمتری دارد. یکی از این […] ادامه متن »

آموزش CSS – جلسه چهارم – رنگ ها در CSS

نویسنده: فرزاد ربیعی
تاریخ: ۵اسفند ام ۱۳۹۰
دسته بندی: CSS طراحی سایت
آموزش CSS – جلسه چهارم – رنگ ها در CSS

رنگ ها در CSS برای مشخص کردن رنگ در CSS، به چند روش زیر می توانیم عمل کنیم: ۱) نام: می توانیم نام رنگ مورد نظر را در قسمت مقدار بنویسیم. مثلا برای مشخص کردن رنگ یک پاراگراف، کد زیر را بنویسیم: که پاراگراف را به رنگ بنفش نمایش می دهد. در عکس زیر نام […] ادامه متن »

آموزش CSS – جلسه سوم – اندازه و واحدها در CSS

نویسنده: فرزاد ربیعی
تاریخ: ۲اسفند ام ۱۳۹۰
دسته بندی: CSS طراحی سایت
آموزش CSS – جلسه سوم – اندازه و واحدها در CSS

اندازه و واحدها در CSS در CSS برای اینکه بتوانیم اندازه را مشخص کنیم (مانند مشخص کردن اندازه یک فونت)، از آیتم های زیر می توانیم استفاده کنیم: %     درصد in      اینچ cm    سانتیمتر mm   میلیمتر em   هر واحد آن برابر با فونت جاری است، مثلا اگر بنویسیم […] ادامه متن »

آموزش CSS – جلسه دوم

نویسنده: فرزاد ربیعی
تاریخ: ۲۷بهمن ام ۱۳۹۰
دسته بندی: CSS طراحی سایت
آموزش CSS – جلسه دوم

برای اینکه متوجه شوید CSS چقدر در طراحی یک سایت تاثیر دارد، می توانید مثال زیر را تمرین کنید(در این مثال می خواهیم یک سایت را بدون CSS ببینیم). یک سایت را در مرورگرتان باز کنید( به دلیل سازگاری مناسب و امکانات بیشتر از مرورگر firefox استفاده می کنم). من برای نمونه سایت yahoo.com را […] ادامه متن »