CSS vlastnost border-width určuje šířku rámečku.
| hodnoty | šířka rámečku |
|---|---|
| pixely nebo jiný rozměr kromě procent | šířka rámečku v pixelech |
| 0px | rámeček tam nebude |
| thin | slabý rámeček |
| medium | středně silný rámeček |
| thick | tlustý rámeček |
Aby se rámeček vykreslil, musí být zadána vlastnost border-style (nebo border). Výchozí šířkou je medium, což jsou asi 3 pixely (ale neměřil jsem to a může to být v každém prohlížeči jinak).
Šířka rámečků různých stran se dá zadat pomocí vlastností border-strana-width, nebo všechny najednou vlastností border-width.
| Prohlížeč | Podpora ve verzích | Poznámka |
|---|---|---|
| 4, 5, 5.5, 6 | započítává šířku rámečku do šířky prvku (quirk mode) | |
| Mozilla (Netscape 6+) | všechny verze | |
| Opera | 4, 5, 6, 7 | |
| Konqueror | ano | |
| IE 5 / Mac | ano | |
| Netscape Navigator 4 | velmi chybně | škoda slov |
Netscape 4 tyto vlastnosti nezná.
Hodně často se rámečky používají na tlačítka. Někdy se dělají třeba tagem <div class="tlacitko">. Kdybych chtěl mít zeleně vystouplé tlačítko, styl vypadá takto:
.tlacitko {border-style: outset; border-width: 5px; border-color: green}
Může nastat situace, kdybych chtěl mít některá tlačítka silnější. Hodí se mi předchozí deklarace (chci ji částečně využít), ale chci mít rámeček desetipixelový. Můžu to udělat třeba přímým stylem:
<div class="tlacitko" style="border-width: 10px">
Jiný způsob je vytvořit ještě jednu třídu (class="sirsi") a přidat ji k tlačítku spolu s předchozí třídou:
<div class="tlacitko sirsi">
prvek potom převezme styl obou tříd, třída sirsi bude mít prioritu (je v pořadí poslednější). Zápis třídy sirsi:
.sirsi {border-width: 10px}
Hodnoty thin, thick a medium se v praxi používají zřídka, protože potom není nikde zaručeno, jak budou přesně široké. Hodí se tam, kde je dokument více informační a nezáleží na přesném vzhledu tolik jako na přenositelnosti mezi médii.
Border-width je také použita v příkladu na border-style.
Barvy v CSS, Border = rámeček, Border-style = druh rámečku, Border-color = barva rámečku, Módy prohlížečů, -moz-box-sizing = započítání rámečků do šířky v Mozille, Width = šířka prvku
Nic relevantního mě nenapadá.
o tvorbě, údržbě a zlepšování internetových stránek