پیغام مدیر :
با سلام خدمت شما بازديدكننده گرامي ، خوش آمدید به سایت من . لطفا براي هرچه بهتر شدن مطالب اين وب سایت ، ما را از نظرات و پيشنهادات خود آگاه سازيد و به ما را در بهتر شدن كيفيت مطالب ياري کنید.
تبلیغات
.
PaidVerts




صفحه قبل 1 2 صفحه بعد

آموزش نرم افزار کرل - گام هشتم
نوشته شده در جمعه 9 آبان 1393
بازدید : 2130
نویسنده : alinn

 

 

آموزش و کاربرد ابزار Artistic Media در کرل

ابزار Artistic Media یک ابزار یا بهتر است بگوییم یک قلم نقاشی می باشد . شما یک سری قلم پیش فرض در لیست قلم های خود دارید که می توانید با توجه به آنها شکل های مورد نظر خودتان را در صفحه ترسیم کنید . Artistic Media شامل 5 ابزار دیگر با نام های Preset . Brush . Spayer . Calligraphic . Pressure می باشد . ( در ادامه به طور کلی هر 5 ابزار را آموزش میدهم ) خود Artistic Media زیر مجموعه ابزارهای Freehand می باشد . روش کار این ابزار به این صورت است که شما یک قلم را با رنگ مشخص در ابتدا از نوار ابزار تنظیمات انتخاب می کنید و یک خط را به صورت صاف یا منحنی در صفحه می کشید بعد مشاهده می کنید که خط کشیده شده شما تبدیل به یک خط با مشخصات انتخاب شده می شود . شما می توانید حالت های نمایش و رنگ بندی خطهای کشیده شده را نیز تغییر دهید .

نرم افزار کرل را اجرا کنید
1. از نوار ابزار بالای صفحه روی منوی File کلیک کرده و گزینه New را انتخاب کنید .

2. ابزار Artistic Media را از لیست ابزارها با تنظیمات پیش فرض انتخاب کنید .

 

ادامه ی مطلب


:: موضوعات مرتبط: آموزشی , corel draw , ,
:: برچسب‌ها: corel draw , corel , help corel , آموزش نرم افزار کرل , کرل , آموزش تصویری نرم افزار کرل , آموزش گام به گام نرم افزار کرل ,



آموزش نرم افزار کرل - گام هفتم
نوشته شده در جمعه 9 آبان 1393
بازدید : 1852
نویسنده : alinn

آموزش و کاربرد ابزار Bezier در کرل

اصلی ترین ابزار برای ترسیم در نرم افزار کرل ، Bezier می باشد . من دو ابزار Freehand . Point Tool که این دو ابزار هم جزو ابزار ترسیم می باشند را در جلسات قبل به طور کامل آموزش داده ام . اما روش کار ابزار Bezier همانند ابزار Pen Tool در فتوشاپ می باشد یعنی شما می توانید نقاط را بعد از ترسیم قبل از اینکه کادر خود را ببندید ، خط مورد نظر را از لحاظ انحنا و تغییرات دیگری که می خواهید بر روی خط بدهید تنظیم کنید .
درادامه با تصاویری که برای شما آماده کرده ام و توضیحات جامعی که در مورد کاربرد ابزار Bezier میدهم بیشتر با این ابزار و تنظیمات آن در نرم افزار کرل آشنا می شوید .
نرم افزار کرل را اجرا کنید .
1. از نوار ابزار بالای صفحه منوی Tools را انتخاب و بر روی گزینه New کلیک کنید .

 

 

ادامه ی مطلب


:: موضوعات مرتبط: آموزشی , corel draw , ,
:: برچسب‌ها: corel draw , corel , help corel , آموزش نرم افزار کرل , کرل , آموزش تصویری نرم افزار کرل , آموزش گام به گام نرم افزار کرل ,



آموزش نرم افزار کرل - گام پنجم
نوشته شده در جمعه 9 آبان 1393
بازدید : 1724
نویسنده : alinn

آموزش و کاربرد ابزار Freehand در کرل

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

 

ادامه ی مطلب


:: موضوعات مرتبط: آموزشی , corel draw , ,
:: برچسب‌ها: corel draw , corel , help corel , آموزش نرم افزار کرل , کرل , آموزش تصویری نرم افزار کرل , آموزش گام به گام نرم افزار کرل ,



آموزش نرم افزار کرل - گام چهارم
نوشته شده در جمعه 9 آبان 1393
بازدید : 1882
نویسنده : alinn

معرفی و کاربرد ابزارهای برش در نرم افزار کرل

اصلی ترین ابزار برش در نرم افزار کرل Crop می باشد . بوسیله این ابزار می توانید یک قسمت از کادر مورد نظر را انتخاب کنید و با دوبار کلیک کردن بر روی آن قسمت بیرونی کادر را حذف کنید .
دومین ابزار زیر مجموعه Crop .ابزار Knife می باشد . روش کار این ابزار هم به این صورت هست که با آن می توانید یک نقطه روی اشکال ایجاد کرده سپس نقطه دیگر را در هر کجایی که مد نظرتان است قرار دهید سپس شکل مورد نظر به دو قسمت تقسیم می شود یا اگر بخواهم یک مثال راحت تر بزنم مثل یک چاقو عمل میکنه کافیه چاقو را روی یک جسم قرار بدهید و در جهت ها مختلف جسم مورد نظر را برش بدهید .
سومین ابزار Eraser می باشد . با این ابزار می توانید قسمت مورد نظر را با کلیک کردن ماوس پاک یا محو کنید.
آخرین ابزار Virtual Segment Delete می باشد . روش کار این ابزار هم به این صورت هست که وقتی روی یک خط قرار می گیرد از حالت اریب به حالت ایستاده آیکونش تغییر می کند که کافیه کلیک کنید تا به سبک خودش کل شکل را محو کند .
حالا اجازه بدهید با توجه به توضیحات بالا کمی در مورد تنظیمات ابزارهای برش هم برای شما توضیح بدهم .

روش کار ابزار Crop
من ابتدا یک شکل با استفاده از ابزار Rectangle میکشم

 

ادامه ی مطلب


:: موضوعات مرتبط: آموزشی , corel draw , ,
:: برچسب‌ها: corel draw , corel , help corel , آموزش نرم افزار کرل , کرل , آموزش تصویری نرم افزار کرل , آموزش گام به گام نرم افزار کرل ,



آموزش نرم افزار کرل - گام سوم
نوشته شده در جمعه 9 آبان 1393
بازدید : 1955
نویسنده : alinn

آموزش کار با ابزار Smudge - Roughen - Free Transform

در جلسه قبلی آموزش ابزار Shape Tool و کاربرد آن را به طور کامل برای شما بازدید کنندگان گرامی توضیح داده ام . امروز می خواهم کاربرد و روش کار با سه ابزار Smudge - Roughen - Free Transform را برای شما به طور کامل و تصویری آموزش بدهم . همانطور که میدانید و در قسمت معرفی نرم افزار کرل برای شما توضیح دادم کاربرد ابزارهای بالا به ترتیب :
ابزار Smudge Brush : روش کار این ابزار به این صورت هست که فرض کنید یک کادر مربع شکل کشیده اید حال با ابزار Smudge Brush اگر به طرف داخل کادر کلیک کنید ناحیه انتخاب شده محو می شود و اگر به طرف بیروی کادر کلیک کنید قسمت مورد نظر به بیرون کادر کشیده می شود .برای لکه گذاری بیشتر بکار می رود
ابزار Roughen Brush : با این ابزار می توانید قسمت بیرونی یک کادر را دندانه دار کنید
ابزار Free Transform : روش کار این ابزار به این صورت هست که ابتدا باید یک شکل را که می خواهید زوایای قرار گیری آن را در صفحه تغییر دهید انتخاب کرده سپس با انتخاب ابزار Free Transform می توانید طرز قرارگیری آن را در صفحه مشخص کنید.

 

ادامه ی مطلب


:: موضوعات مرتبط: آموزشی , corel draw , ,
:: برچسب‌ها: corel draw , corel , help corel , آموزش نرم افزار کرل , کرل , آموزش تصویری نرم افزار کرل , آموزش گام به گام نرم افزار کرل ,



آموزش نرم افزار کرل - گام دوم
نوشته شده در جمعه 9 آبان 1393
بازدید : 1857
نویسنده : alinn

ابزار Shape Tool | آموزش کار با ابزار Shape Tool

دومین ابزار در نرم افزار Corel ، ابزار Shape Tool می باشد . یک ابزار پر کاربرد و فوق العاده . کاربرد این ابزار به این صورت هست که هر شکلی که در کرل کشیده شود برای تغییر شکل آن ، دادن انحنا به خطهای کشیده شده ، حذف و اضافه کردن نقطه هایی که جهت ترسیم اشکال ایجاد شده است بکار می رود .
در ادامه به طور کامل با کاربرد ابزار Shape Tool آشنا می شوید . (سعی میکنم هنگام معرفی کردن و کاربرد ابزارها از ابزارهای دیگر هم استفاده کنم تا بیشتر با کاربرد آنها آشنا شوید )
نرم افزار کرل را اجرا کنید :

 

ادامه ی مطلب


:: موضوعات مرتبط: آموزشی , corel draw , ,
:: برچسب‌ها: corel draw , corel , help corel , آموزش نرم افزار کرل , کرل , آموزش تصویری نرم افزار کرل , آموزش گام به گام نرم افزار کرل ,



آموزش نرم افزار کرل - گام اول
نوشته شده در چهار شنبه 7 آبان 1393
بازدید : 1688
نویسنده : alinn

معرفی و آشنایی اولیه با ابزارهای نرم افزار کرل - Corel X5

اجازه بدهید یک مقدمه در مورد نرم افزار کرل برای شما بنویسم تا بیشتر با کاربرد این نرم افزار آشنا شوید.
همانطور که از نام این نرم افزار مشخص است نرم افزار کرل یک نرم افزار برداری است بر خلاف نرم افزار فتوشاپ که یک نرم افزار پیکسلی می باشد و یک مزیت برای کرل محسوب می شود بدلیل اینکه شما می توانید طراحی خود را بدون افت کیفیت به هر اندازه ای که می خواهید تغییر سایز بدهید اما این امکان در نرم افزار فتوشاپ وجود ندارد و شما باید از همان ابتدا صفحه ای که ایجاد میکنید ابعادش را مشخص کنید.ورژن X5 نسبت به ورژن X4 دارای 40 قابلیت جدید می باشد که خلاصه بار به چندتا از آنها اشاره میکنم :
ابزار Corel Trace : با استفاده از این ابزار می توانید تصاویر Bitmap را تبدیل به تصاویر برداری کنید .
ابزار Image Adjustment Lab : با استفاده از این ابزار می توانید رنگ ، کنتراست و روشنایی تصاویر را تا حد قابل قبولی افزایش دهید .

 

عکس

 

ادامه ی مطلب

 


:: موضوعات مرتبط: آموزشی , corel draw , ,
:: برچسب‌ها: corel draw , corel , help corel , آموزش نرم افزار کرل , کرل , آموزش تصویری نرم افزار کرل , آموزش گام به گام نرم افزار کرل ,



آموزش پاورپوینت-گام ششم(آخر)
نوشته شده در چهار شنبه 7 آبان 1393
بازدید : 1804
نویسنده : alinn

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

 افکت یا انیمیشن بر روی آبجکت ها
1. پاور پوینت را اجرا کنید .از منو بار بالای صفحه روی تب Animation  کلیک کنید .

دقت داشته باشید تا آبجکتی را در اسلاید انتخاب نکنید ابزارهای تب Animation فعال نمی شود .شما می توانید در این صفحه بر روی هر آبجکت یک انیمیشن اجرا کنید.

 

 

ادامه ی مطلب


:: موضوعات مرتبط: آموزشی , power point , ,
:: برچسب‌ها: آموزش پاورپوینت , آموزش , پاورپوینت , آموزش حرفه ای پاورپوینت , پاور , آموزش آی سی دی ال , ,



آموزش پاورپوینت-گام پنجم
نوشته شده در چهار شنبه 7 آبان 1393
بازدید : 1942
نویسنده : alinn

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

تغییر ظاهری اسلاید
1. در مرحله اول نرم افزار را اجرا کرده ، بر روی تب Design کلیک کنید .

شما با انتخاب گزینه Page Setup می توانید اندازه اسلاید ، نمایش طولی و عرضی اسلاید را تغییر دهید
با انتخاب گزینه Slide Orientation اسلاید خودتان را به صورت عمودی یا افقی تنظیم کنید.

2. اما مهمترین بخش در تب Design قسمت Themes می باشد . شما در این بخش می توانید تغییرات ظاهری اسلاید خودتان را به صورت دلخواه تغییر دهید . فقط کافیست ماوس خود را در لیستی که در تصویر زیر مشاهده می کنید برده تا پس زمینه اسلاید شما تغییر کند .

 

ادامه ی مطلب


:: موضوعات مرتبط: آموزشی , power point , ,
:: برچسب‌ها: آموزش پاورپوینت , آموزش , پاورپوینت , آموزش حرفه ای پاورپوینت , پاور , آموزش آی سی دی ال , ,



آموزش پاورپوینت-گام چهارم
نوشته شده در سه شنبه 6 آبان 1393
بازدید : 1971
نویسنده : alinn

آموزش نرم افزار پاور پوینت بخش چهارم
در این بخش میخواهم کار با Smart Art ، ایجاد جدول و کاربرد آنها را برای شما کاربران عیزیز توضیح بدهم . قرار بود که در بخش اول یک آموزش کاربردی و خلاصه و مفید ایجاد کنم که کاربرانی که با این نرم افزار کم و بیش آشنایی دارند نیازی به خواندن مطالب تکراری نداشته باشند اما اولیت را بر این گذاشتم که بیشتر دوستان شاید به تازگی با این نرم افزار آشنا شده باشند و یک آموزش مختصر بدون در نظر گرفتن تمام ابزار شاید کمی گیج کننده برای افراد مبتدی باشه ولی سعی می کنم در یک یا دو درس بعدی به جمع بعدی برسم و یک پروژه کامل را برای شما آموزش بدهم .

کار با Smart Art
در بخش های قبلی به طور خلاصه کارکرد Smart Art را توضیح دادم اما می خواهم در این بخش به طور کامل به این موضوع پرداخته وشما را بیشتر با این ابزار آشنا کنم . گزینه Smart Art  از تب Insert قابل دستیابی است .

 1. بر روی تب Insert کلیک کرده و گزینه Smart artرا انتخاب کنید . می خواهم سر فصل هایی که در اسلاید نمایش داده شود را با Smart art ایجاد کنم .قبل از هرچیز یک اسلاید جدید از تب Home ایجاد کنید(برای مشاهده تصاویر با سایز اصلی بر روی آنها کلیک راست کرده گزینه View Image را انتخاب کنید)

 

ادامه ی مطلب


:: موضوعات مرتبط: آموزشی , power point , ,
:: برچسب‌ها: آموزش پاورپوینت , آموزش , پاورپوینت , آموزش حرفه ای پاورپوینت , پاور , آموزش آی سی دی ال , ,



آموزش پاورپوینت-گام سوم
نوشته شده در سه شنبه 6 آبان 1393
بازدید : 1726
نویسنده : alinn

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

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

1. بعد از اجرایی برنامه ، بر روی گزینه Insert در نوار ابزار کلیک کرده و گزینه Shape را انتخاب می کنیم .(برای مشاهده تصاویر با سایز اصلی بر روی آنها کلیک راست کرده گزینه View Image را انتخاب کنید)

همانطور که در تصویر زیر مشاهده می کنید برای ترسیم کردن یک شکل انتخابهای متفاوتی را ، این جعبه ابزار در اختیار شما قرار داده است کافیست هر کدام از شکل هایی که در لیست زیر مشاهده می کنید

 

ادامه ی مطلب


:: موضوعات مرتبط: آموزشی , power point , ,
:: برچسب‌ها: آموزش کامل برنامه نویسی , آموزش زبان برنامه نویسی css , جزوه ی کامل آموزشcss , css , html , htmx , برنامه ,



آموزش پاورپوینت-گام دوم
نوشته شده در دو شنبه 5 آبان 1393
بازدید : 1951
نویسنده : alinn

آموزش نرم افزار پاور پوینت بخش دوم
در بخش اول کار با اسلاید و کادرهای متنی در نرم افزار پاور پوینت آشنا شدید . در این قسمت می خواهم کمی در مورد وارد کردن عکس در نرم افزار پاور پوینت که تقریبا شبیه نرم افزارهای مجموعه آفیس هست توضیح بدهم . 

وارد کردن عکس در پاور پوینت
وارد کردن تصویر در پاور پوینت تقریبا شبیه بیقیه نرم افزارهای مجموعه آفیس است ولی با کمی تفاوت .بسیار خوب نرم افزار را اجرا کنید . ابزارهایی که در نرم افزارهای دیگر مجموعه آفیس موجود هست ، از توضیح در مورد آنها خودداری کرده و به کلیت کار با عکس در نرم افزار پاور پوینت اشاره می کنم .

1. برای شروع می خواهم یک متن را زیر یک عکس یا دو عکس را انتخاب کرده یک عکس را به عنوان پایین ترین لایه انتخاب کنم برای انجام اینکار از منوی Insert بر روی آیکون Picture کلیک کرده و دو تصویر را وارد می کنم .

2. بعد از وارد کردن تصاویربر روی کلید Arrange کلیک کرده 4 گزینه در لیست وجود دارد :
1.Bring To Front : بالاترین آبجکت

 

 

ادامه ی مطلب


:: موضوعات مرتبط: آموزشی , power point , ,
:: برچسب‌ها: آموزش پاورپوینت , آموزش , پاورپوینت , آموزش حرفه ای پاورپوینت , پاور , آموزش آی سی دی ال , ,



آموزش پاورپوینت-گام اول
نوشته شده در دو شنبه 5 آبان 1393
بازدید : 1773
نویسنده : alinn

با ششمین مهارت ICDL در خدمت شما هستیم . در این قسمت می خواهیم نرم افزار ارائه مطلب یا پاور پوینت را برای شما آموزش دهیم .برنامه Power Point يکي از برنامه هاي بسته نرم افزاري Office به شمار مي رود که با آن مي توانيد مجموعه اسلايدهايي که متن را با  Clipart ، عکس، صدا، تصوير ، و حتي جلوه هاي ويژه متحرک را نمايش دهيد.
علاوه بر اينها چون Power Point يک Package است، مي توانيد سند هاي Word ، کاربرگهاي Excel را به صورت گرافيک و متن و ... به Power Point اضافه نماييد.

آموزش نرم افزار پاور پوینت بخش اول
در حقيقت Power Point قسمت سمعي – بصري برنامه Office است. برنامه Power Point با نصب برنامه Office در سيستم شما ديده مي شود.در قسمت اول یاد می گیرید :


1. ایجاد ، حذف و کپی اسلاید
2. کار با کادرهای متنی ( افکت . سایه . تغییر رنگ چک باکس و ...)
1. برای اجرای برنامه در ویندوز 7 Start>All Program>Microsoft Office>Microsoft Power Point 2010 را اجرا کنید .

نکته : تمام نرم افزارهای مجموعه آفیس تقریبا دارای یک سری ابزار مشترک هستند که در توضیحات سعی میکنم به آنها اشاره نکنم چون در سری اول آموزش نرم افزار Word به طور کامل آنها را آموزش داده ام . سعی میکنم خیلی کلی صحبت کنم تا تا راحت تر بتوانید به مقصد خودتان برسید به عنوان مثال فرض کنید برای یک اداره قصد دارید یک اسلاید معرفی محصولات را ایجاد کنید من کلی به شما میگم که برای انجام اینکار باید چکاری انجام بدهید .

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

 

ادامه ی مطلب


:: موضوعات مرتبط: آموزشی , power point , ,
:: برچسب‌ها: آموزش پاورپوینت , آموزش , پاورپوینت , آموزش حرفه ای پاورپوینت , پاور , آموزش آی سی دی ال , ,



آموزش زبانcss-گام چهاردهم (گام آخر)
نوشته شده در دو شنبه 5 آبان 1393
بازدید : 1498
نویسنده : alinn

با استفاده از استایل این امکان وجود دارد که شکل نشانگر ماوس را وقتی روی قسمت مشخصی از صفحه قرار می گیرد تغییر دهیم. به این منظور می توانیم از ویژگی زیر در استایل مربوط به تگ مورد نظر استفاده کنیم:

cursor: نوع نشانگری که مورد نظر ماست

برای مثال فرض کنید می خواهیم وقتی نشانگر ماوس روی یک قسمت متن قرار می گیرد به شکل ساعت شنی در آید. می توانیم به صورت زیر عمل کنیم (ما برای مشخص شدن متن از رنگ قرمز در تگ span استفاده کرده ایم.):

<span style="cursor: wait; color: red">ماوس خود را روی این متن قرار دهید.</span>

نتیجه را می توانید اینجا مشاهده کنید:

 

ادامه ی مطلب


:: موضوعات مرتبط: آموزشی , زبان برنامه نویسیcss , ,
:: برچسب‌ها: آموزش کامل برنامه نویسی , آموزش زبان برنامه نویسی css , جزوه ی کامل آموزشcss , css , html , htmx , برنامه ,



آموزش زبانcss-گام سیزدهم
نوشته شده در دو شنبه 5 آبان 1393
بازدید : 1835
نویسنده : alinn

background-color

این ویژگی به ما اجازه می دهد تا تقریباً برای هر چیزی در صفحه رنگ زمینه مشخص کنیم. برای این کار باید این ویژگی را به همراه رنگ مورد نظر وارد تگ مربوط به قسمت مورد نظر کنیم. اگر بخواهیم زمینه قسمتی از یک متن را مشخص کنیم می توانیم از این ویژگی در یک تگ SPAN در اطراف متن مورد نظر استفاده کنیم.

در مثال زیر زمینه قسمتی از یک متن را به رنگ زرد در می آوریم:

متن بدون زمینه. این قسمت زمینه زرد دارد.

این هم متن نهایی:

متن بدون زمینه. این قسمت زمینه زرد دارد.

همینطور می توانیم از این ویژگی برای تغییر زمینه یک جدول یا DIV هم استفاده کنیم:

 

 

 

سلول اول سلول دوم

این هم جدول به دست آمده:

سلول اول

سلول دوم

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

یک نمونه دیگر از موارد استفاده این ویژگی در طراحی فرمهاست. به مثال زیر توجه کنید:


نام :

این هم فرم آزمایشی ما:

 

 

ادامه ی مطلب


:: موضوعات مرتبط: آموزشی , زبان برنامه نویسیcss , ,
:: برچسب‌ها: آموزش کامل برنامه نویسی , آموزش زبان برنامه نویسی css , جزوه ی کامل آموزشcss , css , html , htmx , برنامه ,



آموزش زبانcss-گام دوازدهم
نوشته شده در دو شنبه 5 آبان 1393
بازدید : 1748
نویسنده : alinn

از ویژگی color برای تغییر رنگ متن قسمتهای مختلف صفحه استفاده می شود. برای مثال می توانید رنگ متن یک جدول را تغییر دهیم و یا قسمتی از متن صفحه را که با تگ SPAN مشخص کرده ایم با رنگ متفاوتی با بقیه متن نمایش دهیم. این تگ از آن جهت که کاربرد تگ و در نتیجه شناسه color که در تگ فونت استفاده می شود، در HTML4 در حال محدود شدن است اهمیت بیشتری پیدا می کند.

البته در قسمتهای قبلی هم از این ویژگی استفاده کرده ایم اما در باره آن توضیحی داده نشده است.

مانند COLOR در تگ FONT رنگها در این ویژگی به دو صورت تعیین می شوند. شکل کلی این ویژگی به صورت زیر است:

color: نام رنگ مورد نظر
color:#معادل هگزادسیمال رنگ

اگر می خواهید از رنگهای معمولی که با نام شناخته می شوند استفاده کنید کافی است تا نام رنگ مورد نظر خود را در این ویژگی استفاده کنید. این روش ساده تر است ولی انعطاف پذیری کمتری هم دارد چون تنها می توانید رنگ مورد نظر خود را از بین تعداد اندکی نام رنگ انتخاب کنید.

در صورتی که می خواهید از رنگهای بیشتری استفاده کنید و بهتر بتوانید رنگ مو رد نظر خود را انتخاب کنید می توانید از معادل هگزادسیمال رنگها استفاده کنید. در این صورت می توانید از 216 رنگ مورد استفاده در وب رنگ مورد نظر خود را انتخاب کنید.

 

ادامه ی مطلب


:: موضوعات مرتبط: آموزشی , زبان برنامه نویسیcss , ,
:: برچسب‌ها: آموزش کامل برنامه نویسی , آموزش زبان برنامه نویسی css , جزوه ی کامل آموزشcss , css , html , htmx , برنامه ,



آموزش زبانcss-گام یازدهم
نوشته شده در دو شنبه 5 آبان 1393
بازدید : 1578
نویسنده : alinn

در این قسمت به روش تنظیم فونت متن با استفاده از استایل می پردازیم. بسیاری از اعمالی را که قبلاً با تگ انجام می دادیم می توانیم با استایل انجام دهیم.

font-family

ویژگی font-family مشخص می کند که متن با چه فونتی باید نشان داده شود. این ویژگی در حقیقت جانشین شناسه face که در تگ font استفاده می شود است. گزینه پیش فرض برای فونت ممکن است در مرورگرهای مختلف تفاوت داشته باشد، اما معمولاً Times New Roman است.

در مثال زیر از ویژگی font-family برای تغییر فونت متن داخل یک div به Arial استفاده می کنیم:

این متن با فونت Arial نمایش داده می شود.

نتیجه را به صورت زیر مشاهده می کنید:

این متن با فونت Arial نمایش داده می شود.

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

 


font-size

این ویژگی مشخص کننده اندازه فونت در صفحه می باشد. گزینه پیش فرض برای این ویژگی medium است.

فرض کنید می خواهیم متن درون یک DIV با اندازه 30 پیکسل نمایش داده شود:

این متن با اندازه 30 پیکسل نمایش داده می شود.

نتیجه را ملاحظه کنید:

این متن با اندازه 30 پیکسل نمایش داده می شود.

 


font-style

کار این ویژگی تقریباً شبیه تگ در HTML است، اما چون استفاده از تگهایی نظیر , , و در حال کمرنگ شدن است بهتر است از استایل برای مورب نشان دادن متن استفاده شود.این ویژگی می تواند مقادیر زیر را داشته باشد:

 

 

ادامه ی مطلب


:: موضوعات مرتبط: آموزشی , زبان برنامه نویسیcss , ,
:: برچسب‌ها: آموزش کامل برنامه نویسی , آموزش زبان برنامه نویسی css , جزوه ی کامل آموزشcss , css , html , htmx , برنامه ,



آموزش زبانcss-گام دهم
نوشته شده در دو شنبه 5 آبان 1393
بازدید : 1694
نویسنده : alinn

در این قسمت به ادامه ویژگیهایی که بر روی متن ها اثر می گذارند می پردازیم.

text-transform

این ویژگی مشخص می کند که متن با استفاده از حروف بزرگ نوشته شود یا حروف کوچک و یا به صورت معمولی البته بدون آنکه در حروفی که تایپ شده است تغییری به وجود آورید. با این روش اگر خواستید قسمتی از متن مثلاً برای تأکید بیشتر با حروف بزرگ مشاهده شود نیازی نیست که دوباره آن قسمت را از اول تایپ کنید. البته این ویژگی در زبان فارسی چندان استفاده ای ندارد ولی در زبانهایی مثل انگلیسی می توانید آنرا به کار ببرید.

به یک مثال در مورد این ویژگی توجه کنید:

This is an example of uppercase in text-transform property.

این هم نتیجه:

This is an example of uppercase in text-transform property.

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

این ویژگی چند مقدار دارد که در اینجا مشاهده می کنید:

none :
با انتخاب این گزینه متن به همان صورتی که تایپ شده است نمایش داده می شود.


lowercase :
با انتخاب این گزینه متن با حروف کوچک نمایش داده می شود.


uppercase :
این گزینه متن را با حروف بزرگ نمایش می دهد.


capitalize :
این گزینه حروف اول کلماتی را که با حروف کوچک نوشته شده اند با حروف بزرگ و بقیه حروف را با حروف کوچک نمایش می دهد. به مثال زیر توجه کنید:

this is an example of capitalize value for text-transform propety

متن به صورت زیر نمایش داده می شود:

this is an example of capitalize value for text-transform propety

 

 

ادامه ی مطلب


:: موضوعات مرتبط: آموزشی , زبان برنامه نویسیcss , ,
:: برچسب‌ها: آموزش کامل برنامه نویسی , آموزش زبان برنامه نویسی css , جزوه ی کامل آموزشcss , css , html , htmx , برنامه ,



آموزش زبانcss-گام نهم
نوشته شده در دو شنبه 5 آبان 1393
بازدید : 1734
نویسنده : alinn

در این قسمت برخی از ویژگیهای متن را که در CSS استفاده می شوند به شما معرفی می کنیم. با کمک این ویژگیها می توانیم نحوه قرار گرفتن متن در صفحه، فاصله بین حروف و بسیاری از خواص یک متن را تغییر دهیم.

letter-spacing

این ویژگی به ما اجازه می دهد تا فاصله میان حروف یک کلمه را در یک متن تعیین کنیم. این ویژگی می تواند مقادیری را در مقیاس پیکسل به خود بگیرد یا از مقدار normal استفاده کند. گزینه پیش فرض برای این ویژگی همان normal است. در اینجا به ذکر یک مثال در مورد این ویژگی می پردازیم:

فرض کنید می خواهیم از این ویژگی برای متن موجود در یک تگ DIV استفاده کنیم:


حروف این متن با فاصله 5 پیکسل از یکدیگر نمایش داده خواهند شد.

نتیجه را به صورت زیر مشاهده خواهید کرد:

حروف این متن با فاصله 5 پیکسل از یکدیگر نمایش داده خواهند شد.

 

 

ادامه ی مطلب



:: موضوعات مرتبط: آموزشی , زبان برنامه نویسیcss , ,
:: برچسب‌ها: آموزش کامل برنامه نویسی , آموزش زبان برنامه نویسی css , جزوه ی کامل آموزشcss , css , html , htmx , برنامه ,



آموزش زبانcss-گام هشتم
نوشته شده در دو شنبه 5 آبان 1393
بازدید : 2321
نویسنده : alinn

position

ویژگی position به ما اجازه می دهد تا تعیین کنیم که آیا می خواهیم موقعیت یک عنصر در صفحه مشخص شود یا نه. اگر می خواهیم آن عنصر موقعیت مشخصی داشته باشد موقعیت عنصر را در صفحه تعیین می کند. چندین مقدار را می توان برای این ویژگی قرار داد. در اینجا می توانید این مقادیر را با کمی توضیح در مورد هر کدام ببینید:

static :
این مقدار پیش فرضی است که در صورت تعریف نشدن position در صفحه استفاده می شود. با این مقدار اجزا در همان جایی که کد آنها را می نویسید دیده می شوند.


absolute :
این مقدار به ما اجازه می دهد تا یک عنصر از صفحه را در هر موقعیتی نسبت به بالا، راست، پایین یا چپ صفحه که بخواهیم نمایش دهیم.


fixed :
این گزینه به ما اجازه می دهد تا موقعیت یک عنصر صفحه را در پنجره مرورگر مشخص کنیم. در صورتی که برای یک عنصر از این ویژگی استفاده کنیم، موقعیت آن عنصر حتی در صورتی که به بالا و پایین صفحه برویم یا اندازه پنجره مرورگر را تغییر دهیم به همان صورت قبلی باقی می ماند. البته اینترنت اکسپلورر در ویندوز از این ویژگی پشتیبانی نمی کند ولی اینترنت اکسپلورر در مکینتاش همچنین مرورگرهای نت اسکیپ از این ویژگی پشتیبانی می کنند.


static

این ویژگی در حقیقت مشخص می کند که عنصر مربوطه باید در محلی که کد آن نوشته شده نمایش داده شود. وقتی که از این ویژگی استفاده می کنیم ویژگیهای top, left, bottom, right کاربردی ندارند.

این ویژگی به صورت پیش فرض از طرف مرورگر برای صفحه مورد استفاده قرار می گیرد.


fixed

چون اینترنت اکسپلورر بیشتر از سایر مرورگرها مورد استفاده قرار می گیرد و از ویژگی fixed در CSS پشتیبانی نمی کند زیاد به این ویژگی نمی پردازیم. اما در هر صورت ویژگی جالبی است. در اینجا فقط به ذکر یک مثال بسنده می کنیم:

در این مثال از ویژگی position:fixed برای تعیین موقعیت یک DIV استفاده می کنیم:

اگر با مرورگر netscape یا مرورگرهایی مثل firefox و opera از این صفحه بازدید کنید محتویات این div در میانه صفحه و سمت راست آن به نمایش در می آیند.

اگر می خواهید ببینید این ویژگی چگونه کار می کند لینک زیر را با یکی از مرورگرهای Opera, Netscape یا Firefox مشاهده کنید و صفحه را با استفاده از اسکرول بار به بالا و پایین ببرید:

استفاده از ویژگی position:fixed ( لینک در پنجره جدید باز می شود ).

 

ادامه ی مطلب


:: موضوعات مرتبط: آموزشی , زبان برنامه نویسیcss , ,
:: برچسب‌ها: آموزش کامل برنامه نویسی , آموزش زبان برنامه نویسی css , جزوه ی کامل آموزشcss , css , html , htmx , برنامه ,