বৈশিষ্ট্য outline-style

outline-style বৈশিষ্ট্যটি বাহ্যিক রূপরেখার স্টাইল নির্ধারণ করে - একটি সীমানা যা কোন জায়গা দখল করে না।

সিনট্যাক্স

cssসিলেক্টর {
  outline-style: মান;
}

মান	বর্ণনা
`solid`	একটি অবিচ্ছিন্ন রেখা।
`dotted`	বিন্দু আকারে রূপরেখা।
`dashed`	ড্যাশ আকারে রূপরেখা।
`ridge`	উত্তল রেখা আকারে রূপরেখা।
`double`	দ্বি-রেখা আকারে রূপরেখা। প্রভাব দেখতে হলে রূপরেখার পুরুত্ব অন্তত `3px` হতে হবে।
`groove`	অবতল রূপরেখা।
`inset`	ধসে যাওয়া রূপরেখা।
`outset`	উত্তল রূপরেখা।
`none`	কোনো রূপরেখা নেই।

ডিফল্ট মান: none।

html<div id="elem"></div>

css#elem {
  outline-width: 1px;
  outline-style: solid;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

html<div id="elem"></div>

css#elem {
  outline-width: 1px;
  outline-style: dotted;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

html<div id="elem"></div>

css#elem {
  outline-width: 1px;
  outline-style: dashed;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

html<div id="elem"></div>

css#elem {
  outline-width: 3px;
  outline-style: ridge;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

html<div id="elem"></div>

css#elem {
  outline-width: 3px;
  outline-style: double;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

html<div id="elem"></div>

css#elem {
  outline-width: 3px;
  outline-style: groove;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

html<div id="elem"></div>

css#elem {
  outline-width: 3px;
  outline-style: inset;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат:

html<div id="elem"></div>

css#elem {
  outline-width: 3px;
  outline-style: outset;
  outline-color: black;
  width: 300px;
  height: 100px;
}

Результат: