Hr тегі

hr тегі көлденең бөліп көрсету сызығын белгілейді. Тегтің артықшылығы - бір сызық сызу үшін артық блоктар құрудың қажеті жоқ. Жабу тегі қажет емес.

Мысал

hr тегінің қалай жұмыс істейтінін қарап көрейік:

html<hr>

Результат:

Мысал

CSS-тің border-color қасиеті арқылы сызық түсін өзгертуге тырысайық:

html<hr style="border-color: red;">

Результат:

Мысал

Сызық түсін color қасиеті арқылы да өзгертуге болады (бұл ретте, егер color және border-color қасиеттері бір мезгілде берілсе - екіншісі басым болады):

html<hr style="color: red">

Результат:

Мысал

Енді сызық түсін CSS-тің border қасиеті арқылы өзгертейік. Назар аударыңыз, бұл ретте сызық қос қалыңдықта болады (себебі біз жоғарғы және төменгі шекараны белгіледік):

html<hr style="border: 1px solid red;">

Результат:

Мысал

CSS-тің border-top қасиеті арқылы сызық түсін өзгертуге тырысайық, және тек жоғарғы шекараны белгілейік. Енді қос сызық болмайды:

html<hr style="border-top: 1px solid red;">

Результат:

Мысал

CSS-тің border-top қасиеті арқылы сызықты нүктелер түрінде жасайық, solid орнына dotted мәнін белгілейік:

html<hr style="border-top: 1px dotted red;">

Результат:

Мысал

CSS-тің border-width қасиеті арқылы сызық қалыңдығын арттырайық:

html<hr style="border-width: 10px; border-color: red;">

Результат:

Мысал

Енді сызыққа height биіктігі мен border арқылы шекараны қосамыз. Шекара бұл ретте жоғарғы және төменгіге бөлінеді:

html<hr style="height: 10px; border: 1px solid red;">

Результат:

Сондай-ақ қараңыз