Wbr-tagi

Tagi wbr osoittaa kohdan, jossa selain voi tehdä rivinvaihdon tarvittaessa (jos teksti ei mahdu elementin leveyteen). Tällaisia rivinvaihtoja kutsutaan pehmeiksi.

Ei vaadi suljavatagia.

Kun sanaa siirretään wbr -tagin kautta, siirtomerkkiä "-" ei lisätä. Jos sitä tarvitset - käytä pehmeää siirtomerkkiä  (puolipiste lopussa pakollinen, tämä ei ole kirjoitusvirhe).

Pehmeä siirto  osoittaa selaimelle kohdan, jossa se voi tehdä rivinvaihdon sanassa (tarvittaessa), asettaen samalla siirtomerkin "-".

Pehmeät siirrot  eivät toimi, jos ominaisuus hyphens on asetettu arvoon none (mutta siirrot wbr toimivat).

Esimerkki . Teksti ilman siirtoja

Katsotaanpa näytettä tekstistä, jossa on pitkiä sanoja, jotka ulottuvat lohkon rajojen ulkopuolelle. Annetaan lohkolle pieni leveys niin, että pitkä sana ei mahdu siihen:

<div id="elem">
	this is supersupersuperlong text
</div>

#elem {
	width: 200px;
	border: 1px solid black;
}

Esimerkki . Wbr-tagi

Täällä, lisätään wbr -tagi paikkoihin, joissa suosittelemme selaimelle tekemään sanan siirron tarvittaessa (huomatkaa, että selain tekee siirrot ei kaikkialla, missä osoitimme):

<div id="elem">
	this is super<wbr>super<wbr>super<wbr>long text
</div>

#elem {
	width: 200px;
	border: 1px solid black;
}

Esimerkki . -merkki

Kokeillaan wbr -tagin sijaan asettaa merkki . Siirtokohtiin tulee näkyviin tavuviivoja:

<div id="elem">
	this is supersupersuperlong text
</div>

#elem {
	width: 200px;
	border: 1px solid black;
}

Katso myös

tagi br,
,
joka tekee rivinvaihdon uudelle riville
ominaisuus hyphens,
joka asettaa todelliset sanansiirrot
ominaisuudet word-break ja overflow-wrap,
jotka sallivat pitkän sanan kirjainten siirtämisen
ominaisuus overflow,
joka leikkaa lohkon rajojen yli ulottuvat osat

Wbr-tagi

Esimerkki . Teksti ilman siirtoja

Esimerkki . Wbr-tagi

Esimerkki . &shy;-merkki

Katso myös

Esimerkki . -merkki