ویژگی outline در CSS

outline یا خط خارجی یک خط در اطراف border می سازد.

خط outline از اطراف border شروع می شود. outline روی margin قرار می گیرد و margin را می پوشاند.

نکته:  outline هیچ فاصله ای بین border و margin ایجاد نمی کند و روی margin را قرار می گیرد.

نکته: outline هیچ فاصله ای بین المان ها ایجاد نمی کند و روی المان های دیگر را قرار می گیرد.

  • outline-style : مشخص کردن سبک خط خارجی 
  • outline-width : تعیین عرض خط خارجی 
  • outline-color : تعیین رنگ خط خارجی
  • outline : خلاصه نویسی ویژگی های خط خارجی
  • outline-offset : تعیین فضای بین border و outline

سبک خط خارجی (outline-style) در CSS

ویژگی outline-style، سبک خط خارجی را مشخص می کند.

outline-style: dotted;

نکته: برای اطلاعات بیشتر به آموزش ویژگی outline-style در CSS مراجعه کنید.

عرض خط خارجی (outline-width) در CSS

ویژگی outline-width، عرض خط خارجی را مشخص می کند.

border-width: thin;

نکته: برای اطلاعات بیشتر به آموزش ویژگی outline-width در CSS مراجعه کنید.

رنگ خط خارجی (outline-color) در CSS

ویژگی outline-color، رنگ خط خارجی را مشخص می کند.

outline-color: red;

نکته: برای اطلاعات بیشتر درباره انواع رنگ، آموزش رنگ ها در CSS را بررسی کنید.

نکته: برای اطلاعات بیشتر به آموزش ویژگی outline-color در CSS مراجعه کنید.

خلاصه نویسی یا outline در CSS

ویژگی outline، به صورت خلاصه ، تمام ویژگی های outline را مشخص می کند.

outline: dotted 3px blue;

نکته: برای اطلاعات بیشتر به آموزش ویژگی outline در CSS مراجعه کنید.

outline-offset در CSS

ویژگی outline-offset، فضای بین border و outline را تعیین می کند.

outline-offset: 5px;

نکته: برای اطلاعات بیشتر به آموزش ویژگی outline-offset در CSS مراجعه کنید.

خلاصه درس

در این درس با ویژگی خط خارجی (outline) آشنا شدیم:

  • outline-style
  • outline-width
  • outline-color
  • outline
  • outline-offset

توسعه دهندگان
احسان اسلامی