logo1398

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

مرکز آموزش تخصصی و فوق تخصصی نصب و تعمیرات ماشین های اداری و سخت افزار کامپیوتر


ثبت نام  آنلاین    شهریه دوره ها 

نکته CSS برای افراد تازه کار

در زمان های قدیم ما وابستگی زیادی به توسعه دهندگان و برنامه نویسان وب برای بروز کردن وب سایتمان داشتیم حتی برای سایتی کوچک ! باید از CSS و انعطاف پذیری آن ممنون باشیم که اکنون می توانیم سبک یک صفحه را به طور مستقل و به دور از کد های پیچیده ایجاد کنیم . اکنون با یک فهم ابتدایی از CSS حتی یک تازه کار نیز می تواند سبک و ظاهر یک وب سایت را تغییر دهد .

چه شما علاقمند باشید که با استفاده از CSS وب سایت خودتان را ایجاد کنید و چه با استفاده از آن ظاهر وبلاگ خود را تغییر کوچکی بدهید همیشه خوب است که برای بدست آوردن یک بنیان قوی کار خود را با اصول شروع کنید. بیاید به نکاتی از CSS نگاهیبیاندازیم که ممکن هست برای تازه کار ها مفید باشد :
۱٫استفاده از RESET.css
زمانی که سبک های CSS خود را نوشتید هر مرورگری مانند Firefox و یا Internet Explorer به شکل متفاوتی آن ها را بررسی و نمایش می دهند. با استفاده RESET.css تمام سبک های بنیادی شما مجدد تنظیم می شوند و با ایجاد یک صفحه شما با یک صفحه کاملا خالی شروع خواهید کرد.
۲٫از دستورات کوتاه CSS استفاده کنید
دستورات کوتاه CSS مسیر کوتاه تری برای نوشتن کد های CSS شما فراهم می کند و از همه مهم تر استفاده از این تکنیک باعث واضح تر شدن و فهم آسان تر کد می شود.
به جای استفاده از کد زیر
.header
از کد زیر استفاده کنید :
.header
3.فهمیدن کامل CLASS و ID
این انتخاب کننده ها اغلب تازه کار ها را گیج می کند. در CSS انتخابگر class با “.” نمایش داده می شود و id با “#”
در یک کلام id روی سبک های منحصر بفرد و یکتا استفاده می شود و نباید تکرار شود اما در طرف دیگر class را می توان چندین بار استفاده کرد.
4.قدرت <Li>
این تگ بسیار مفید می باشد وقتی که به درستی آن را با تگ های <ul> و <ol> استفاده کرد. از این تگ بیشتر برای ساخت منو ها استفاده می شود.
5. <table> را فراموش کنید ,<div> را امتحان کنید
یکی از بهترین مزیت های CSS استفاده از عنصر <div> برای رسیدن به ظاهری بسیار انعطلاف پذیر است . <div> بر خلاف <table>, محتوا را در داخل سلول های <td>‘قفل’ نمی کند. می توان گفت که تمامی طرح ها توسط <table> را می توان با <div> ساخت . خب شاید به جز جدولی عظیم از اطلاعات !
6. ابزار دیباگ CSS
همیشه بهتر هست برای دیدن پیشنمایش طرح و سایت خود از یک دیباگر استفاده کنید . دیباگر به شما کمک میکند تا مشکلات CSS خود را راحت تر و سریع تر حل و البته فهم بیشتری نسبت به کار خود پیدا کنید . در این جا چند دیباگر رایگان CSS را به شما معرفی می کنیم که می توانید آن را روی مرورگر خود نصب کنید :
FireFox Web Developer, DOM Inspector, Internet Explorer Developer Toolbar, Firebug
7. پرهیز از انتخاب کننده های زائد
بعضی اوقات می توان انتخاب گر های CSS را کوتاه و ساده تر نوشت , یعنی <li> فقط داخل <ol> و یا <ul>می باشد و یا تگ <tr> در داخل تگ <table> قرار دارد به مثال زیر توجه کنید :
به جای کد زیر :
ul li
ol li
table tr td
میتوان نوشت :
li
td
8.استفاده از !important :
هر سبکی که توسط !important مشخص شده باشد قوانین زیرین خود را نادیده میگیرد . به مثال زیر توجه کنید :
.page
در مثال بالا پس زمینه به رنگ آبی در میاید و رنگ های زیرین خود را نادیده میگیرید . از این روش بیشتر برای مواردی استفاده می شود که نمی خواهیم سبکمان در جای دیگر تغییر کند. البته این دستور در IE ممکن است کار نکند.
9.جایگذاری کردن متن با تصویر
معمولا برای جایگذاری کردن <h1>title</h1> با یک عکس به شکل زیر عمل می کنیم :
h1
در مثال بالا از text-indent برای برای خارج کردن متن از صفحه نمایش استفاده می کنیم و با background یک پس زمینه مناسب به آن می دهیم.
10.گرد کردن گوشه ها در CSS
با استفاده از دستور border-radiusبه جای دستورات پیچیده JavaScriptبه راحتی میتوانید حاشیه های خود را گرد کرده و ظاهر زیبا به آن ها بدهید .
11.کد های CSS خود را تمیز نگه دارید
اگر کد های شما بهم ریخته می باشد شما تا پایان کد زدن سردرگم خواهید بود و زمان زیادی برای بازگشت به کد قبلی خود باید بگذارید . برای جلوگیری از این مشکل می توانید در بین کد هایتان از توضیحاتی استفاده کنید.
12.فهم کامل انواع مدیا ها
تعداد کمی از انواع مدیا ها وقتی شما CSS را با استفاده از <link> اعلان می کنید وجود دارد. Print , projection و screen تعدادی از معمول ترین نوع ها هستند . فهمیدن و استفاده مناسب از آن ها امکانات ویژه ای به سایت شما میدهد.
13.استفاده از z-index
توسعه دهندگان و طراحان به آن راز می گویند . شما طراحانی را پیدا خواهید که مقادیر بسیار زیادی از z-index را روی div و دیگر عناصر خود گذاشته اند . با استفاده از این تکنیک می توانید عناصر را روی همدیگر قرار دهید . اما برای استفاده از آن می بایست position عنصراصلی یکی از مقادیر زیر را داشته باشد :
position:absolute, position:relative, یاposition:fixed
14.استفاده از MARGIN AUTO
استفاده از آن روشی بسیار جالب برای آن است که عنصر مورد نظر را خود در وسط صفحه نمایش بدون آنکه نگران اندازه صفحه نمایش کاربر باشیم قرار دهیم . به هر حال برای استفاده از آن می بایست عرض عنصر مشخص باشد.
15.از padding با دقت استفاده کنید
یک اشتباهی که بیشتر اوقات رخ میدهد استفاده از padding بدون آن ها تاثیرات آن را بدانیم است. این را همیشه به خاطر بسپاریم که padding باعث افزایش عرض و یا ارتفاع صفحه می شود. به مثال زیر توجه کنید :
#div
اکنون میتوانید حدس بزنید که عرض عنصر چقدر است ؟
۲۰۰ + ۳۰ + ۳۰ + ۲ +۲ = ۲۶۴

ستاره غیر فعالستاره غیر فعالستاره غیر فعالستاره غیر فعالستاره غیر فعال
 

دوره های آموزشی ما

اطلاعات تماس

آدرس : تهران - میدان ولی عصر - مرکز تجارت ایرانیان - طبقه نهم - واحد پنج

ساعت کاری شرکت : 9 صبح تا 8 شب
کلاس های روز جمعه ویژه کارمندان و دوره های فشرده دایر میباشد 

phone325 3

04 92 92 88 -021

05 92 92 88 -021

91 14 847- 0912

92 14 847- 0912 

 آموزش شارژ کارتریج, اموزش شارژ کارتریج, آموزش شارژ کارتریج لیزری, آموزش شارژ کارتریج جوهر افشان, آموزش شارژ, آموزش شارز پرینتر, آموزش شارژ سامسونگ, آموزش شارژ اچ پی, آموزش شارژ کاتریج, اموزش شارژ کاتریج, آموزش شارژ کارتریج, اموزش شارژ کارتریج, آموزش شارژ کردن کارتریج, آموزش شارژ کارتریژ, آموزش شارژ کارتریج لیزری, آموزش شارژ کارتریج جوهر افشان, آموزش شارژ کارتریج پرینتر, آموزش شارژ کارتریج لیزری , آموزش شارژ کاتریج , آموزش شارژکاتریژ , آموزش شارژ انواع کارتریج , آموزش تخصصی شارژ کارتریج,آموزش شارژ پرینتر , تونر,کارتریج لیزری, آموزش تعمیرات فتوکپی,اموزش تعمیرات چاپگر,آموزش تعمیرات پرینتر,اموزش تعمیرات پرینتر, آموزش تعمیرات دستگاه کپی شارپ,آموزش تعمیر کپی آنالوگ و دیجیتال,آموزش تعمیرات دستگاه کپی ریکو,آموزش تعمیرات کپی آفیشیو,آموزش تعمیرات آنالوگ و دیجیتال,آموزش تعمیرات دستگاه کپی توشیبا آنالوگ و دیجیتال,آموزش تعمیرات دستگاه کپی,آموزش تعمیر دستگاه کپی و فتوکپی,آموزش تعمیرات کپی رنگی, دوره آموزشی,آموزش تعمیرات,آموزش تعمیرات فنی,آموزش خدمات,آموزش تعمیر,اموزش تعمیر,دوره های آموزشی,فنی کار,امید,رحمانی,امید رحمانی,دوره اموزش,اموزشگاه فنی,فنی و حرفه ای, آموزش الکترونیک, دوره آموزش الکترونیک, آموزش الکترونیک, الکترونیک پایه, آموزش الکترونیک تخصصی, طراحی برد الکترونیک،آموزش طراحی برد, مهندسی معکوس, آموزش مهندسی معکوس, آموزش الکترونیک مخصوص بازارکار, آموزش الکترونیک اس ام دی, آموزش الکترونیک smd, آموزش نقشه خوانی, آموزش کار با هیتر, الکترونیک, برق, طراحی, مدار, ای وی ار, ال ای دی, ابزار دقیق, پی ال سی, plc, اینورتر, inverter, منبع تغذیه, سوئیچینگ, رله, خازن, ماژول, smd, led, طراحی برد صنعتی, پروژه دانشگاهی, دوره تخصصی آموزش نصب دوربین مدار بسته,آموزش نصب دوربین مداربسته, دوره آموزش نصب دوربین مدار بسته,آموزش نصب دوربین های مداربسته, آموزش تخصصی نصب دوربین مدار بسته,آموزش دوربین مداربسته,آموزشگاه,آموزش,نصب, آموزش تعمیر انواع دوربین های مدار بسته,آموزش تعمیرات دوربین های مدار بسته,قوی ترین مرکز آموزش تعمیرات دوربین مخفی,بهترین مرکز آموزش تعمیر دوربین مخفی در تهران,قدرتمندترین مرکز آموزش تعمیر دوربین های مدار بسته,آموزش تعمیر تخصصی دوربین های مدار بسته