خواص فاصله گذاری(راهنمای html)

5436 تعداد بازدید | چهارشنبه 24 تیر ماه 1394

فاصله بین کادر یک دستور و محتویات آن با استفاده از خواص فاصله گذاری تعیین میشود

فاصله بین کادر یک دستور و محتویات آن با استفاده از خواص فاصله گذاری تعیین میشود. این خواص عبارتند از: , padding-left padding-bottom . padding-right .padding-top خاصیت padding استفاده کرد که فاصله هر چهار طرف را تعیین میکند. این خاصیت از یک تا چهار مقدار می پذیرد که با شروع از بالای کادر، به طرف حرکت عقربه های ساعت مورد استفاده قرار می گیرند. هر کدام از مقادیر که ذکر نشود، همانند طرف مقابل خودش خواهد بود. مثلاً اگر فاصله سمت راست تعیین شود ولی سمت چپ تعیین نشود،فاصله سمت چپ مانند فاصله سمت راست تنظیم میشود. دستورات زیر را ببینید:

{padding-top : 1cm)
{border-style : solid; padding-left : 20mm ; padding-right : 50mm)
{border-style : solid; padding : 1cm)
{padding : 2mm 4mm

دستور سوم یک خط ضخیم دور کادر رسم می کند و فاصله هر طرف با محتویات آن یک سانتیمتر است. دستور چهارم فاصله از بالا و پایین را ۲ میلیمتر و فاصله از سمت راست و چپ را ۴ میلیمتر در نظر می گیرد. خواص Width و height. خاصیت width پهنای ناحیه محتویات دستورات را تعیین میکند و خاصیت height ارتفاع ناحیه محتویات دستورات را مشخص می کند. دستورات زیر را ببینید

height {width: 300px; padding : 10px; background : yellow ; color : black)
{height : 10cm ; width: 10%}
{height : 100px; width: 300px}

-خاصیت float .و floatl تنظیم افقی دستورات را تحت تأثیر قرار می دهد و موجب میشود به سمت چپ یا راست ناحیه دستور حرکت کنند. این خاصیت برای درج اشیایی مثل تصویر در صفحه وب مفید است.مقادیر float عبارتنداز right ، left و noneکه none مقدار پیش فرض است. دستور زیر را ببینید:

{float : right}

اما وقتی محل تصویر یا هر شیء دیگری که توسط float تعیین شد، متنهای آن عنصر چگونه تنظیم می شوند؟ این کار توسط خاصیت clear انجام می گیرد. مقدار left، سمت چپ اشیاء، مقدار right سمت راست اشیاء و مقدارboth هر طرحی را که بزرگتر بود پاک می کند. مقدار پیش فرض آن none است:

{width: 150 ; height: 150 ; float: right}
{clear : both}

خواص دسته بندیشیوه نامه های آبشاری شامل چندین خواص دسته بندی اند که دسته بندی نمایش یک دستور را مشخص می کند. بعضی از این خواص در زیر بررسی میشوند:خاصیت display . مدل CSS سه نوع عناصر نمایشی را تشخیص می دهد: عناصر بلوکی، عناصر دستوریو لیستها. خاصیت display موجب میشود تا نوع نمایش یک عنصر به یکی از این ۴ مقدار تغییر کند: blOCK(بلوکی)، inline (دستوری)، list-item (لیست) و none. مقدار none موجب میشود که عنصر نمایش داده نشود و یا از فضا استفاده نکند. دستورات زیر را ببینید:

{display : none}
{display : inline}

خاصیت white-space. این خاصیت تعیین میکند که کاراکترهای فضای خالی، tab و خط جدید چگونه در یک دستور ظاهر شوند. مقدار پیش فرضی آن normal است که همه کاراکترهای فضای خالی به یک فضای خالی تبدیل می شوند و خطوط به طور خودکار شکسته می شوند. مقدار pre برای این خاصیت مشخص میکند که تمام کاراکترهای فضای خالی منظور شوند (مثل دستور <pre>در HTML.) مقدار nowrap موجب می شود تا درصورتی که طول خطوط از پهنای محتویات بیشتر شد، شکسته نشود. دستور زیر را ببینید{white-space : pre)توجه کنید که مقادیر pre و nowrap از خاصیت white-space، در بسیاری از مرورگرها پشتیبانی نمی شوند.

مقالات مرتبط به طراحی سایت :

خواص فاصله گذاری(راهنمای html)

خواص فاصله گذاری(راهنمای html)

هایبــــــــرد

دنیای تجارت بدون مرز