آموزش CSS | تنظیم خواص باکس ها Border , Margin , Padding

تنظیم خواص باکس ها Border , Margin , Padding در CSS

در این بخش از آموزش css ، تنظیم خواص باکس ها را آموزش میدهیم. همه ی عناصری که در HTML  تعریف میشوند میتوانند این ویژگی ها را داشته باشند. این بخش یکی از مهمترین آموزش ها ، در سی اس اس و طراحی قالب سایت می باشد. طول یک Element در واقع شامل مجموع مقدار تمامی این ویژگی ها به علاوه طول خود شی می باشد .
برای مثال جمع کل طول یک شی با ویژگی های زیر ۳۰۰px  میباشد.

width:250px;
padding:10px;
border:5px solid gray;
margin:10px;

===  محاسبه کل طول  ====

۲۵۰px (width)
+ ۲۰px (left + right padding)
+ ۱۰px (left + right border)
+ ۲۰px (left + right margin)
= ۳۰۰px

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

این ویژگی ها برای کسانی که طراحی سایت مبتدی هستند کمی پیچیده است.

 

ارسال دیدگاه