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

css-code-sample-printed

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

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

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

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

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

ادامه مطلب…

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

برچسب‌ها,

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

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

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

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

 

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

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

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

ادامه مطلب…

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

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

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 را نشان میدهد :

ادامه مطلب…

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

برچسب‌ها,

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

نحوه قالب بندی سایت :

به کمک دستور div در طراحی قالب، باکس ایجاد میکنیم و اجزای سایت را داخل این باکس ها load میکنیم

یک div باید width  و height و رنگ ( background ) داشته باشد.

میخواهیم عکس زیر را که در فتوشاپ ایجاد شده به کمک css و html به یک قالب سایت تبدیل کنیم :

برای دیدن عکس در اندازه اصلی روی آن کلیک کنید

homeword1

 

 

 

 

 

 

 

 

ادامه مطلب…

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

برچسب‌ها

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

html-css

هر دستور css از سه بخش تشکیل میشود :

 

 

 

 

Selector همان انتخابگر یا گزینشگر هستند مثل p ,div, …

Property همان خصویات مثل color

Value نیز مقدار هر خصوصیت black

مثالی برای موارد بالا :

ادامه مطلب…

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

برچسب‌ها,


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