element {
background-color: color || #hex || (rgb / % || 0-255);
background-image:url(URI);
background-repeat: repeat || repeat-x || repeat-y || no-repeat;
background-position: X Y || (top||bottom||center) (left||right||center);
background-attachment: scroll || fixed;
}
CSS Shorthand یک مجموعه از تکنیک و دستورات است که به منظور خلاصه نویسی دستورات CSS مورد استفاده قرا میگیرد .
خلاصه نویسی دستورات CSS میتواند به ما کمک کند تا :
این مطالب به صورت یک مجموعه ارائه خواهد شد و در مطالب بعدی با خلاصه نویسی دستورات برای خصوصیات دیگر ( Background , Border , Margin and Padding , Outline , List-style ) آشنا خواهیم شد .
Positioning این امکان را به شما خواهد داد تا موقعیت یک عنصر را در چینش صفحه وب سایت انتخاب کنید . این خصوصیت به شما امکان خواهد داد یک عنصر را بر روی عناصر دیگر قرار دهید و یا تعیین کنید چه اتفاقی رخ دهد وقتی محتوای یک عنصر بسیار بزرگ باشد .
با تعیین عناصر top , right , bottom , left میتوانید موقعیت یک عنصر در صفحه را تعیین کنید . تعیین این مقادیر به تنهایی کار ساز نخواهند بود و باید نوع این تعیین موقعیت نیز مشخص شود .
تعیین موقعیت عناصر در صفحه ( CSS Positioning ) دارای چهار مقدار و روش ( static , absolute , relative , fixed ) متفاوت است که در زیر به توضیح این روشها و نحوه استفاده از آنها خواهیم پرداخت .
float یا شناوری این امکان را به یک عنصر می دهد تا شناور شود و به سمت چپ یا راست حرکت کند . وقتی به یک عنصر خاصیت float به سمت چپ یا راست داده میشود ، عنصر مورد نظر به آن سمت حرکت کرده و بقیه عناصری که بعد از عنصر float شده آمده اند و float ندارند به سمت مخالف رانده شده و اطراف عنصر مورد نظر را می گیرند .
توانایی float CSS نقش مهمی را در طراحی ساختار وب سایت با استفاده از لایه ها ، خواهد داشت . به طور مثال در ساده ترین حالت از این خاصیت برای حرکت تصاویر در متن استفاده می شود.
توانایی Display مشخص کننده نحوه نمایش یک عنصر در صفحه است و توانایی Visibility مشخص کننده قابل مشاهده بودن یا مخفی بودن یک عنصر است .
برای مخفی نمودن یک عنصر با استفاده از CSS میتوانید از دو توانایی display , visibility استفاده نمائید که هر یک دارای خصوصیات متفاوتی هستند.
با تعیین خصوصیت و توانایی display:none و یا visibility:hidden شما میتوانید یک عنصر را مخفی کنید اما نتایج متفاوت خواهند بود .
بساری از عناصر در یک سند CSS ، دارای style های یکسانی می باشند ، تکرار این گونه از خصوصیت ها میتواند حجم سند CSS را افزایش دهد و هچنین راحتی کنترل و کار با سندهای CSS را تحت تاثیر قرار دهد .
برای بهینه نمودن کدهای CSS از تکنیک گزینشگرهای گروهی ( CSS Grouping Selectors ) برای افزایش کنترل ، کاهش حجم کدها و سند CSS استفاده میشود .
تمامی عناصر HTML را میتوان به صورت یک چهار ضلعی یا جعبه ( Box ) در نظر گرفت . برای ایجاد ساختار مناسب در طراحی یک وب سایت این Box ها در کنار یکدیگر قرار خواهند گرفت . مفهوم Box Model در CSS به بررسی خصوصیات و توانایی های این اجزاء ( Box ) می پردازد .
مفهوم یک Box در CSS نشان دهنده محیط اطراف یک عنصر HTML است که دارای خصوصیات Margin , Padding ,Border و محتوا یا Content است .
مفهوم Box Model این توانایی را به ما میدهد تا فاصله محتویات ( Content ) تا خط محیطی ( Border ) را تعیین کنیم ( Padding ) ، ضخامت خط مرز ( Border ) را تعیین کنیم و یا فاصله خارجی یک عنصر HTML را با دیگر عناصر تعیین کنیم ( Margin ) میتوانید در طرح زیر این مفهوم را دقیقتر درک کنید .
در این مطلب سعی خواهد شد که تعدادی از خصوصیات تگ های HTML که امروزه کمتر از آنها در طراحی وب سایت استفاده می شود را بیان کنیم . استفاده درست از این تگها می تواند در بهینه تر شدن کار یک طراح وب سایت و همچنین استاندارد بودن وب سایت کمک کند.
کاربران یک وب سایت مهمترین هدف از ایجاد و راه اندازی یک وب سایت هستند ،بنابر این طراحی وب سایت با این هدف که تمامی کاربران بتوانند به راحتی از وب سایت استفاده کنند همیشه باید مدنظر یک طراح وب سایت قرار گیرد.سرعت بارگذاری صفحات وب یکی از مهمترین نکاتی است که باید برای راحتی یک بازدید کننده در نظر گرفته شود ، به خصوص در کشورهایی که تعداد بسیار زیادی از مشترکان اینترنت هنوز از سیستم Dial Up برای اتصال به اینترنت استفاده می کنند و دارای محدودیت سرعت هستند.
تصاویر مورد استفاده در طراحی وب سایت ، نحوه استفاده از آنها و فرمت تصاویر می توانند نقش تعیین کننده ای در زمان بارگزاری صفحات وب سایت داشته باشند ، بنابراین بهینه سازی تصاویر و استفاده از تکنیکهای CSS برای کاهش استفاده از تصاویر در صفحات وب می تواند به سریعتر شدن وب سایت کمک کند.در این رابطه می توانید مطلب زیر را نیز مطالعه کنید .
افزایش سرعت , کاهش مصرف پهنای باند – CSS Sprite
یکی از مهم ترین اصول در طراحی ، وجود تعادل ( Balance ) است . بالانس ، تعادل ، توزیع متناسب اجزاء سنگین و سبک در یک صفحه است . منظور از سنگینی و سبکی در اینجا ماهیت سنگین و سبک اجزاء هستند به طوری که اجزاء بزرگتر و تیره تر بسیار سنگین تر و اجزاء کوچکتر و روشن تر سبکتر به نظر می رسند. قانون تعادل به ما نشان میدهد چگونه یک صفحه همراه با تعادل را داشته باشیم .
یکی از ساده ترین و اصولی ترین روشها برای ایجاد تعادل در طراحی استفاده از شبکه ( Grid ) برای ایجاد یک تعادل و چینش متوازن و متناسب (alignment ) در طراحی است .
مخاطبان و بازدید کنندگان صفحات وب می توانند این خطوط را درک کنند و با چشم خود امتداد این خطوط را در صفحات وب سایت دنبال می کنند ، البته بدون اینکه خطوط قابل رویتی در صفحات وب سایت شما موجود باشد.
سازگاری یک صفحه وب و کدهای آن با مرورگرهای گوناگون و متعددی که وجود دارند ( IE , FireFox , Opera , Chrome ) ، یکی از مشکلات و چالش های جدی برای طراحان وب سایت بوده است. یک طراح وب سایت گاهی مجبور به افزودن کدهای بسیار پیچیده در لابلای فایلهای CSS – سی اس اس خود است تا این ناسازگاری و تفاوت در نمایش صفحات در مرورگرهای متفاوت را به این نحو سازگار جلوه دهد.
این چالش تا به ابنجا پیش رفته است که ، توانایی در طراحی وب سایت ، به طوری که در تمامی مرورگرها به طور یکسان نمایش داده شود ( Cross Browser ) ، یک امتیاز بسیار خوب برای یک طراح وب است. بسیاری از گروه ها و طراحان وب سایت برای راحتی در استفاده از کدهای CSS – سی اس اس به این منظور راه حل ها و تکنیکهای گوناگونی را بررسی کرده اند ، و به نظر میرسد استفاده از تکنیک CSS Reset به این منظور از محبوبیت بیشتری برای طراحان وب سایت بر خوردار است .
CSS یک ابزار بسیار مناسب ، اساسی و قدرتمند برای طراحی وب سایت و شکل بخشیدن به صفحات وب سایت است که با ارائه ورژن جدید آن ( CSS3 ) قدرت بیشتری نیز گرفته است . دراین مجموعه تلاش خواهد شد ، تعدادی از تکنیک های کاربردی ، فوق العاده و ساده از CSS را با یکدیگر مرور کنیم .
با استفاده از روش اندازه گذاری متغیر برای فونت ها ( em ) ، اندازه فونت ها با توجه به محیط اطراف و اجزاء تشکیل دهنده وب سایت تعیین می شود ، و کاربران نیز می توانند به راحتی با استفاده از تنظیمات مرورگر خود اندازه فونت ها را به دلخواه خود تغییر دهند.
تصاویر بخش بسیار مهمی از قسمت قابل نمایش از هر وب سایت را تشکیل می دهند و میزان حجم , کیفیت , و نوع آنها تاثیر قابل ملاحظه ای در استاندارد بودن و جذابیت هر چه بیشتر یک وب سایت دارد.
در اینجا سه فرمت اصلی تصاویر مورد استقاده در وب و نحوه و زمان استفاده از هر کدام را بررسی می کنیم.
زندگی یک آزادکار پر شده از بالا و پایین ها ، موافقت ها و مخالفت ها و زیباییها و مشکلات. در این مطلب سعی می کنم تعدادی از مشکلات آزادکارها و راه حل برون رفت از این مشکلات رو برای شما دوستان بازگو کنم .بعضی از این مطالب صرفا نظرات شخصی من هست و شاید مثالهای نقض هم داشته باشه بنابر این با نظرات خودتون به تکمیل تر شدن و یا اصلاح این مطلب کمک کنید.
وقتی از بیرون به یک آزاد کار نگاه میکنیم زندگیش به نظر خیلی جالب و هیجان انگیز می یاد .شما به عنوان یک آزاد کار سرنوشتتون به دست خودتونه و خودتون تصمیم می گیرید کی کار کنید و چه مدت کارتون طول بکشه. این که صبح چه زمانی از توی رختخوابتون بیاید بیرون دست خودتونه ، زمانی رو که برای نهار خوردن صرف میکنید به خودتون بستگی داره و اگه دوست داشته باشد می تونید سر ظهر یه خواب کوتاه هم داشته باشید و استراحت کنید.
هیچ ساعتی رو نگاه نمی کنید ، نفس هیچ کارفرمایی بالای سر شما نیست ، فقط آزادی هست و آزادی شما در انتخاب زمان و مکان کارتون آزاد هستید ، اینها واقعی به نظر میرسه ولی اما به این شیوه کار کردن راحته؟
آزاد کاری بالا و پایین ها و سود و زیان های زیادی داره پس قبل از اینکه کمدتون رو خالی کنید و کامپیوتر تون رو تحویل بدید به رئیستون ، خوب این مطلب رو بخونید تا با خوب و بدهای آزاد کاری آشنا بشید چون در حل تمامی مشکلات کاریتون شما تنها خواهید بود .
داشتن یک وب سایت برای ارائه خدمات ، محصولات و یا توانائیها در دنیای امروز لازم و ضروری به نظر میرسد . بسیاری از افراد ، سازمانها ، شرکتها در داخل کشور ضرورت داشتن یک وب سایت را درک کرده اند اما آیا روشهای استفاده از یک وب سایت را نیز درک کرده اند و یا اینکه وب سایتهای آنها جوابگوی نیازهای مخاطبانشان هست و استانداردهای اولیه طراحی وب در آنها رعایت شده است؟
طراحی و در واقع ساخت و ایجاد یک وب سایت مراحل بسیاری را شامل می شود که هر یک از این مراحل به صورت موازی از اهمیت ویژه ای برخوردارند. به بیان ساده تر مراحل ایجاد و طراحی یک وب سایت به صورت حلقه های زنجیر به یکدیگر متصلند و ضعف و یا نبود یک حلقه می تواند بر روی کیفیت یک وب سایت تاثیر بسیاری داشته باشد . کلیه مراحل ساخت یک وب سایت باید به صورت برنامه ریزی شده ، هدفمند و گام به گام پیش رود تا در نهایت به نتیجه ای مطلوب برسد. شاید خواندن مطالب زیر با توجه به ترتیب آنها بتواند در تعیین برنامه و هدف شما در ساخت یک وب سایت تاثیر گذار باشد.