Vaadake, kuidas veebibrauseris HTML-i tühikute ruumi töödeldakse
Kui olete algusest veebidisainer, on üks paljudest asjadest, mida peate alguses mõistma, veebibrauseritega veebisaidi koodi tühikute ruumi.
Kahjuks ei ole brauserite käsitsemine tühimikega kõigepealt väga intuitiivne, eriti kui te satute HTML-i ja võrdle seda, kuidas vabade ruumidega töödeldakse tekstitöötlusprogrammides, millest võib olla tuttav.
Tekstitöötlusprogrammides saate lisada dokumendis palju vahemaid või vahelehti ja vahekaugus kajastub dokumendi sisu kuvamises. See ei kehti HTML-i ega veebilehtede puhul. Sellisena on väga oluline teada saada, kuidas veebibrauseritega tühi ruumi käideldakse.
Spacing in Print
Tekstitöötlusprogrammides on kolm esmast tühja ruumi tähemärki ruumi, saki ja kärje tagastamist. Kõik need toimivad erilisel viisil, kuid HTML-i puhul muudavad brauserid need kõik põhimõtteliselt ühesugused. Ükskõik, kas paigutate oma HTML-märgistusesse ühe tühiku või 100 tühiku või segate oma vahelehtede vahekaartidega ja kärude tagasitõmbamisega, siis lükatakse kõik need brauseri külge ümber ühele ruumile. Veebi disaini terminoloogias nimetatakse seda valge ruumi kollapsiks. Selliseid tüüpilisi vahekaugusklahve ei saa kasutada veebisaidi tühiku tühjendamiseks, sest brauseri abil sulgeb mitu tühikut brauseris rippimiseks ainult ühte tühikut,
Miks keegi kasutab vahelehti?
Tavaliselt kasutavad tekstidokumendis vahekaarte kasutajad neid skemaatilistel põhjustel või teksti saamiseks teatud kohas liikumiseks või mõne teise elemendi vahekauguseks. Veebidisainis ei saa te neid visuaalseid stiile või kujundamisvajadusi saavutada ülalnimetatud tühimärkidega.
Veebidisainis on koodidevaheliste tähemärkide kasutamine täiesti lihtsalt selle koodi lugemise hõlbustamiseks. Veebi disainerid ja arendajad kasutavad koodi sisestamiseks sageli vahelehti, et näha, millised elemendid on teiste elementide lapsed, kuid need taanded ei mõjuta lehe enda visuaalset paigutust. Neile, mida vajatakse visuaalse paigutuse muutmiseks, peate pöörduma CSS-i (kaskaaditavate stiililehtede) poole.
HTML-vahelehtede ja vahemaa loomiseks CSS-i kasutamine
Veebisaidid on täna ehitatud struktuuri ja stiili eristamisega. Lehe struktuuri käsitab HTML, samal ajal kui stiil määrab CSS. See tähendab, et vahekohtade loomiseks või teatud paigutuse saamiseks peaksite pöörama CSS-ile ja mitte lihtsalt HTML-koodi vahele jäävate tähemärkide lisamist.
Kui soovite teksti veerge luua vahekaartide abil, võite kasutada selle veeru kujunduse saamiseks selle asemel CSS-i abil asuvaid
Kui teie poolt välja toodud andmed on tabelandmed, saate neid tabeleid joondada vastavalt oma soovidele. Tabelid leiavad tihti veebipõhises disainis halbat repi, kuna neid on nii paljude aastate jooksul kasutatud puhaste kujundamisvahenditena, kuid tabelid on endiselt täiesti kehtivad, kui teie sisu sisaldab eespool nimetatud tabelis toodud andmeid.
Marginad, padding ja tekst-taane
Kõige tavalisemad CSS-vahekauguste loomise viisid on üks järgmistest CSS-i stiilidest:
- marginaal
- polsterdus
- teksti taane
Näiteks võite lõigu esimese rea taande teha, näiteks järgmise CSS-i vahekaardiga (märkus, et see eeldab, et teie lõigul on sellele lisatud "esimese" klassi atribuut):
p.first {
teksti taane: 5em;
}
Nüüd peaks see lõige olema umbes 5 tähemärki.
CSS-i abil saate kasutada marginaali või täitematerjali omadusi, et lisada elemendi ülemisse, alani, vasakule või paremale (või nende kombinatsioone) vahekaugus. Lõppkokkuvõttes saate CSS-i pöördumiseks vaja mis tahes vahekaugust.
Teksti teisaldamine rohkem kui ühe ruumi ilma CSSita
Kui soovid ainult seda, et teie teksti liigutaks eelmisest elemendist rohkem kui ühe tühiku võrra, võite kasutada tühimikku.
Mittejätkatava ruumi kasutamiseks lisage lihtsalt & nbsp; nii palju kordi, kui vajate seda oma HTML-märgistuses.
Näiteks, kui soovite oma sõna vii tühikut üle viia, võite enne sõna lisada järgmised.
& nbsp; & nbsp; & nbsp; & nbsp; & nbsp;HTML austab neid ja ei lammuta neid ühte ruumi. Kuid seda peetakse väga halvaks, sest see lisab dokumendile täiendavat HTML-märgistust ainult paigutusvajaduste saavutamiseks. Viidates sellele struktuuri ja stiili lahutamisele, peaksite vältima mitte-purunevate ruumide lisamist ainult soovitud kujundusjõu saavutamiseks ning selle asemel tuleks kasutada CSS-i marginaale ja polsterdamist.