Хосияти border-width

Хосияти border-width ғафсии ҳудудро барои ҳама тарафҳо дар як вақт ё ба таври ҷудогона барои ҳар тараф муайян мекунад. Хосияти мухтасари хосиятҳои border-left-width, border-right-width, border-top-width, border-bottom-width мебошад.

Қимати хосият ҳамаи воҳидҳои барои андозаҳо, ба истиснои фоизҳо, мебошад, ё калимаҳои калидӣ thin (ҳудуд дар 2 пиксел), medium (ҳудуд дар 4 пиксел) ё thick (ҳудуд дар 6 пиксел). Қимати пешфарз: medium.

Синтаксис

интихобкунанда {
	border-width: 1, 2, 3 ё 4 қимат;
}

Миқдори қиматҳо

Хосият метавонад 1, 2, 3 ё 4 қиматро қабул кунад, ки ба воситаи фосила муайян карда мешаванд:

Миқдор	Тавсиф
`1`	Навъ барои ҳама тарафҳо дар як вақт.
`2`	Қимати аввал барои боло ва поён, дуввумӣ - барои ҳудудҳои чап ва рост.
`3`	Қимати аввал барои боло, дуввумӣ - барои ҳудудҳои чап ва рост, сеюмӣ - барои поёнӣ.
`4`	Қимати аввал барои ҳудуди болоӣ, дуввумӣ - барои рост, сеюмӣ - барои поёнӣ, чорумӣ - барои ҳудуди чап.

Намуна

Ҳудудеро бо ғафсии як пиксел муайян кунем:

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

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

Намуна

Ҳудудеро бо ғафсии 4 пиксел муайян кунем:

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

#elem {
	border-width: 4px;
	border-style: solid;
	border-color: black;
	width: 300px;
	height: 100px;
}

Намуна

Ғафсии ҳудуди болоӣ ва поёниро дар 1px, ва рост ва чапро дар 4px муайян кунем:

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

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

Намуна

Ғафсии ҳудуди болоиро дар 1px, рост ва чапро дар 4px, ва поёниро дар 6px муайян кунем:

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

#elem {
	border-width: 1px 4px 6px;
	border-style: solid;
	border-color: black;
	width: 300px;
	height: 100px;
}

Намуна

Ғафсии ҳудуди болоиро дар 1px, ростро дар 4px, поёниро - дар 6px, ва чапро дар 8px муайян кунем:

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

#elem {
	border-width: 1px 4px 6px 8px;
	border-style: solid;
	border-color: black;
	width: 300px;
	height: 100px;
}

Намуна

Ғафсии ҳудудро бо калимаи калидии thin муайян кунем:

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

#elem {
	border-width: thin;
	border-style: solid;
	border-color: black;
	width: 300px;
	height: 100px;
}

Намуна

Ғафсии ҳудудро бо калимаи калидии medium муайян кунем:

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

#elem {
	border-width: medium;
	border-style: solid;
	border-color: black;
	width: 300px;
	height: 100px;
}

Намуна

Ғафсии ҳудудро бо калимаи калидии thick муайян кунем:

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

#elem {
	border-width: thick;
	border-style: solid;
	border-color: black;
	width: 300px;
	height: 100px;
}

Намуна

Ҳудуди гуногунро барои тарафҳои гуногун муайян кунем:

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

#elem {
	border-width: 1px 2px 3px 4px;
	border-style: dashed dotted solid double;
	border-color: red blue green black;
	width: 300px;
	height: 100px;
}

Ҳамчунин бубинед

хосияти border-style,
ки намуди зоҳирии ҳудудро муайян мекунад
хосияти border-color,
ки рангҳои ҳудудро муайян мекунад
хосияти border,
ки хосияти мухтасари барои ҳудуд мебошад