در CSS چگونه حاشیه ها را تنظیم کنیم؟در مقالات گذشته با چند دستور مختلف در CSS آشنا شدیم.اما در این بخش میخواهیم به نحوه تنظیم حاشیه در CSS بپردازیم.
حاشیه داخلی و خارجی در CSS
در CSS به دو صورت میتوان حاشیه را تنظیم کرد،این مبحث نیز جهت آموزش CSS حرفه ای لازم می باشد.پیشنهاد می شود از فیلم آموزش CSS نیز استفاده نمایید.
نخست دستور padding در CSS و دوم دستور margin در CSS. هر یک از این دستورات در جای خود در CSS کاربرد دارند.تفاوت این دو دستور چیست؟دستور margin در CSS در حقیقت حاشیه خارجی را تعیین می کند.یعنی فاصله یک عنصر HTML از عناصر اطراف آن.اما دستور padding در CSS چه می کند؟ این دستور برای تنظیم حاشیه داخلی در CSS کاربرد دارد.بدین صورت که فاصله محتوای یک عنصر را از دیواره عنصر والد تعیین می کند.معمولا از این دو دستور برای تنظیم حاشیه استفاده می شود.دستور padding را در CSS ژمانی به کار می برند که بخواهند محتوای یک عنصر از اطرلاف عنصر پدر فاصله بگیرد.دستور margin در CSS به چهار جهت تقسیم می شود:
- margin-top
- margin-right
- margin-bottom
- margin-left
این چهار دستور برای تنظیم حاشیه از چهار طرف در CSS استفاده می شود.مشابه با دستور margin ، برای دستور padding هم همین حالت وجود دارد.حاشیه داخلی از بالا،راست،پایین و چپ در CSS.توجه نمایید که در CSS می توان margin و padding با مقدار منفی نیز به یک عنصر تخصیص داد.در حقیقت مقدار منفی،جهت حاشیه را معکوس می کند.این دو دستور در آموزش CSS ، بسیار پرکاربرد هستند و در موارد بسیار زیادی از آنها استفاده می گردد.از اینرو لازم است با دستور margin و همچنین padding آشنایی کافی داشته باشیم.علاوه بر شبوه ذکر شده،می توانیم برای ایجاد حاشیه در CSS ، از شیوه خلاصه شده و مخفف نیز استفاده کنیم.در ان حالت فرمت دستور CSS برای margin بدین صورت است:
p {
margin: 10px 150px 10px 80px;
}
اعداد مشخص شده به ترتیب،حاشیه CSS از بالا،راست،پایین و سمت چپ هستند.به همین صورت برای دستور padding هم همین شیوه مخفف را می توان به کار برد.
در تصویر بالا حاشیه CSS با رنگ زرد مشخص شده است.عنصر A از عنصر B حاشیه سمت رساتی یعنی margin-right دارد،بنابراین بین این دو عنصر CSS حاشیه یا margin وجود دارد.در مقالات بعد به آموزش ASP.NET می پردازیم.
سایت بزرگ کلیک سایت،بهترین مرجع در ضمینه آموزش طراحی سایت و آموزش html و آموزش css میباشد.تمامی فیلم های آموزشی این سایت توسط استادان کاردان و بسیار با تجربه تهیه شده که تضمینی بر کیفیت بالای تمامی آن ها است.قیمت محصولات نیز کاملا رقابتی بوده و با مقایسه آن با سایر سایت ها میتوان به خوبی متوجه این موضوع شد.
هیچ نظری موجود نیست:
ارسال یک نظر