آموزش فریمورک بوتسترپ برای طراحی سایت – قسمت اول

bootstrapیکی از مهمترین قسمتهای طراحی وب این هست که صفحات درست و بدون مشکل از همون اول به صورت مرتب در همه مرورگر ها نمایش داده شوند .

منتها اینکار خیلی زمان گیر و گاهی هم اعصاب خورد کن میشه. چپ و راست کردن این div ها، تغییر دادن موقعیتشون، خصوصا اگه در حال طراحی یک سایت چند زبانه باشی که یکیش هم راست به چپه!

این فریم وورک توسط توییتر ارایه شده و گسترش داده میشه..

 

این آموزش بر اساس نسخه Bootstrap 2.3.2 ایجاد شده که بعد از این آموزش نسخه 3 نیز آموزش داده خواهد شد .

ادامه مطلب…

Like
0

دسته بندی‌ها: آموزش,طراحی وب

خلاصه نویسی دستورات css , html به کمک sublime Text

css-code-sample-printed

طبق اموزش جلسه قبل ابتدا باید افزونه Emmet را در ادیتور sublime نصب کنیم سپس از دستورات زیر استفاده کنید :

برای آشنایی با دستورات Emmet به صفحه زیر مراجعه کنید :

http://docs.emmet.io/cheat-sheet

کلا با کلید Tab کار داریم کافی است بعد هر یک از دستورات زیر Tab بزنیم :

 تعدادی از دستورات معروف HTML را با هم مرور میکنیم :

ادامه مطلب…

Like
1

دسته بندی‌ها: htm - CSS,آموزش

آموزش کار با ویرایشگر سبک و سریع Sublime text برای کد نویسی :

sublimeدر این چند سال طراحی وب ادیتور های زیادی را استفاده کردم که در نهایت

از sublime Text خوشم اومد ،نحوه نصب افزونه های کاربردی و کلید های میانبر را در این ادیتور مرور میکنیم:

ابتدا در این ویرایشگر Package Control را فعال میکنیم تا بتوانیم افزونه نصب کنیم و وادیتور کاربردی تری داشته باشیم :

 

روش اول نصب افزونه  به کمک اینترنت :

وارد لینک زیر شوید :

http://sublime.wbond.net/installation#st3

ادامه مطلب…

Like
0

دسته بندی‌ها: htm - CSS,آموزش,طراحی وب

معرفی چند سایت و ابزار کاربردی برای طراحان وب

برای طراحی سایت معمولا از ابزار های زیر استفاده میکنم :

افزونه های فایرفاکس :HTML-tags

Awesome Screenshot: Capture & Annotate

MeasureIt!

Firebug

ColorZilla

 

برای ایده گرفتن ، از طرح های زیبای سایت تم فارست استفاده کنید :

http://themeforest.net/

ادامه مطلب…

Like
0

دسته بندی‌ها: آموزش,طراحی وب

آموزش طراحی قالب وب سایت – جلسه پنجم

html-css CSS position تعیین موقعیت

این امکان را به ما خواهد داد تا موقعیت یک عنصر را در چینش صفحه وب سایت انتخاب کنید .

تعیین موقعیت عناصر در صفحه باچهار مقدار top , right , bottom , left و روش های ( absolute , relative , fixed ) انجام میگیرد

تعیین موقعیت ثابت ( Fixed Positioning ) :
یک عنصر با نوع موقعیت ثابت ( fixed ) نسبت به پنجره مرورگر تعیین موقعیت خواهد شد . این عنصر با حرکت صفحه به بالا و پایین و حتی چپ و راست ( scroll ) تغییر موقعیت نخواهد داد
عنصر با نوع موقعیت fixed از جریان صفحه جدا شده است و با حرکت صفحه در جای خود ثابت باقی می ماند .

 
تعیین موقعیت مطلق ( Absolute Positioning ) :
یک عنصر با نوع موقعیت مطلق ( absolute ) از جریان طبیعی صفحه خارج خواهد شد . این عناصر نسبت به اولین عنصر پدر خود ( parent ) که دارای خاصیت relative تغییر موقعیت خواهند داد . اگر هیچ پدر نداشت که خاصیت relative داشته باشد از المنت body موقعیت میگیرد ..
مثال زیر برای قرار دادن منو در بخش head سایت است که نحوه ارتباط ul و div را نشان میدهد :

ادامه مطلب…

Like
0

دسته بندی‌ها: htm - CSS,آموزش,طراحی وب


Copyright © 2006 - 2017 Hemmaty.com
Design : M.hemmaty
Follow

Get every new post delivered to your Inbox

Join other followers