Ustvarjanje prostorov in fizično ločevanje elementov v HTML je za začetnega spletnega oblikovalca težko razumljivo. To je zato, ker HTML ima lastnost, imenovano "propad praznine". ne glede na to, ali v kodo HTML vnesete 1 presledek ali 100, spletni brskalnik te presledke samodejno strne v samo en presledek. To se razlikuje od programa, kot je Microsoft Word, ki ustvarjalcem dokumentov omogoča dodajanje več presledkov za ločevanje besed in drugih elementov tega dokumenta. Razmik pri oblikovanju spletnih strani ne deluje tako.
Torej, kako dodate presledke v HTML, ki so prikazani na spletna stran, ki ste jo zgradili? Ta članek preučuje nekaj različnih načinov.
Presledki v HTML-ju s CSS-jem
Najprimernejši način za dodajanje presledkov v HTML je z Cascading Style Sheets (CSS). CSS je treba uporabiti za dodajanje kakršnih koli vizualnih vidikov spletne strani, in ker je razmik del značilnosti vizualnega oblikovanja strani, je CSS tam, kjer želite, da se to naredi.
V CSS lahko uporabite lastnosti roba ali oblazinjenja, da dodate prostor okoli elementov. Poleg tega lastnost zamika besedila dodaja prostor na sprednji strani besedila, na primer za zamike odstavkov.
Tu je primer, kako s CSS dodati prostor pred vsemi odstavki. Dodajte naslednji CSS v svoj zunanji ali notranje slogovni list:
p {
alinea besedila: 3em;
}
Presledki v HTML-ju znotraj vašega besedila
Če želite besedilu dodati samo dodaten presledek ali dva, lahko uporabite presledek. Ta znak deluje tako kot standardni presledek, le da se znotraj brskalnika ne sesuje.
Tu je primer, kako v vrstico besedila dodate pet presledkov:
V besedilu je pet dodatnih presledkov
Uporablja HTML:
V besedilu je pet dodatnih presledkov
Uporabite lahko tudi
za dodajanje dodatnih prelomov vrstic.
Ta stavek ima na koncu pet prelomov
Zakaj je razmik v HTMLju slaba ideja
Obe možnosti sicer delujeta - element, ki ne lomi presledkov, bo resnično dodal razmike besedilu in vrstici odmori bodo dodali presledek pod zgornjim odstavkom - to ni najboljši način za ustvarjanje presledkov v vašem Spletna stran. Če dodate te elemente v HTML, v kodo dodate vizualne informacije, namesto da bi ločili strukturo strani (HTML) od vizualnih slogov (CSS). Najboljše prakse narekujejo, da jih je treba ločiti iz več razlogov, med drugim zaradi enostavnega posodabljanja v prihodnosti in celotne velikosti datotek ter uspešnost strani.
Če za narekovanje vseh svojih slogov in razmikov uporabljate zunanjo tabelo, potem je spreminjanje teh slogov za celotno spletno mesto enostavno, saj morate preprosto posodobiti ta slog.
Razmislite o zgornjem primeru stavka s petico
oznake na koncu. Če bi želeli tolikšen razmik na dnu vsakega odstavka, bi morali to kodo HTML dodati vsakemu odstavku na celotnem spletnem mestu. To je precejšen dodaten dodatek, ki bo napihnil vaše strani. Poleg tega, če se po cesti odločite, da je ta razmik prevelik ali premajhen in ga želite nekoliko spremeniti, boste morali urediti vsak odstavek na celotnem spletnem mestu. Ne, hvala!
Namesto da dodate te razmične elemente v kodo, uporabite CSS.
p {
oblazinjenje-dno: 20px;
}
Ta ena vrstica CSS bi dodala presledke pod odstavki vaše strani. Če ste v prihodnosti želeli spremeniti ta razmik, uredite to vrstico (namesto kode celotnega spletnega mesta) in že ste pripravljeni!
Če želite v en del spletnega mesta dodati en presledek, uporabite
tag ali en sam neprekinjen presledek ni konec sveta, vendar morate biti previdni. Uporaba teh vrstic razmika v vrstici HTML je lahko spolzka. Čeprav eden ali dva morda ne bosta škodovali vašemu spletnemu mestu, če nadaljujete po tej poti, boste na svoje strani vnesli težave. Na koncu se raje obrnite na CSS za razmik HTML in vse druge vizualne potrebe spletnih strani.