See, kuidas brauserid tühimärgiga ümber käisid, ei ole alguses eriti intuitiivne, eriti kui võrrelda seda, kuidas hüperteksti märgistuskeel käsitab tühimikku tekstitöötlusprogrammidega võrreldes. Tekstitöötlustarkvaras saate dokumendile lisada palju tühikuid või vahelehti ja see tühik kajastub dokumendi sisu kuvamisel. See WYSIWYG-i kujundus ei kehti HTML-i ega veebilehtede puhul.
Tühik prindis
Tekstitöötlustarkvaras on kolm peamist tühimärki ruumi, vahelehtja vedu tagasi. Kõik need tähemärgid toimivad erineval viisil, kuid HTML-is muudavad brauserid need kõik sisuliselt ühesugusteks. Ükskõik, kas asetate oma ruumi ühe või 100 tühiku HTML-i märgistus või segage vahekaugus sakkide ja kärude tagasitulekutega, kui kõik lehed renderdatakse, koondatakse need kõik ühte ruumi. brauser. Veebidisaini terminoloogias on see tuntud kui valgete ruumide kokkuvarisemine. Neid tüüpilisi tühikuklahve ei saa veebilehele tühimiku lisamiseks kasutada, kuna brauser ahendab brauseris renderdamisel korduvad tühikud ainult ühte ruumi,
CSS-i kasutamine HTML-i vahelehtede ja tühikute loomiseks
Tänapäeval on veebisaidid üles ehitatud struktuuri ja stiili lahus. Lehe struktuuri haldab HTML, stiili dikteerivad kaskaadsed stiililehed. Tühikute loomiseks või kindla paigutuse saavutamiseks pöörduge HTML-koodi tühimärkide lisamise asemel CSS-i poole.
Kui proovite kasutada vahelehed teksti veergude loomiseks kasutage hoopis
Kui teie paigutavad andmed on tabeliandmed, kasutage nende andmete joondamiseks soovitud tabeleid. Tabelitel on veebikujunduses sageli halb räpp, sest neid kasutati nii paljude aastate jooksul puhaste paigutustööriistadena, kuid tabelid kehtivad endiselt täiesti, kui teie sisu sisaldab tõeliselt tabeliandmeid.
Veerised, polstrid ja tekstitaane
Kõige tavalisemad viisid CSS-iga tühikute loomiseks on kasutada ühte järgmistest CSS-stiilidest:
- marginaal
- polsterdus
- teksti taane
Näiteks taandage lõigu esimene rida nagu vahekaart järgmise CSS-iga (pange tähele, et see eeldab, et teie lõigu juurde on lisatud klassi atribuut "esimene"):
p.first {
teksti taane: 5em;
}
See lõik taandab umbes viit tähemärki.
Kasutage veerus veerist või täidise omadusi CSS tühiku lisamiseks elemendi ülemisele, alumisele, vasakule või paremale (või nende külgede kombinatsioonidele). CSS-i poole pöördudes saavutage igasugune vajalik vahe.
Teksti liigutamine rohkem kui ühes ruumis ilma CSS-ina
Kui soovite, et teie tekst liiguks eelmisest üksusest rohkem kui ühe tühiku kaugusele, kasutage katkematut tühikut.
Murdumatu ruumi kasutamiseks lisate nii palju kordi kui vajate seda HTML-i märgistuses.
HTML austab neid murdumatuid tühikuid ja ei ahenda neid ühte ruumi. Seda lähenemist peetakse siiski halvaks tavaks, kuna see lisab dokumendile täiendava HTML-i märgistuse ainult paigutusvajaduste saavutamiseks. Kui see on teostatav, vältige murduvate tühikute lisamist lihtsalt soovitud kujundusefekti ja kasutamise saavutamiseks CSS-veerised ja polsterdused selle asemel.