Dobro oblikovanje spletnih strani pogosto gre za dobro tipografijo. Ker je toliko vsebine spletne strani predstavljeno kot besedilo, je oblikovanje besedila privlačnega in učinkovitega pomembna veščina, ki jo morate imeti kot spletni oblikovalec. Na žalost v spletu nimamo enake ravni tipografskega nadzora kot tiskane. To pomeni, da besedila na spletnem mestu ne moremo vedno zanesljivo oblikovati na enak način kot v tiskanem delu.
Eden najpogostejših slogov odstavkov, ki ga pogosto vidite v tisku (in ki ga lahko poustvarimo v spletu), je, če je prva vrstica tega odstavka zamaknjena prostor zavihkov. To omogoča bralcem, da vidijo, kje se en odstavek začne, drugi pa konča.
Na spletnih straneh tega vizualnega sloga ne vidite toliko, ker brskalniki privzeto prikazujejo odstavke s presledkom pod njimi kot način, kako prikazati, kje se konča eno in začne drugo, če pa želite oblikovati stran, da bo to tiskano navdih slog zamika v odstavkih lahko to storite z zamik besedila lastnost sloga.
Sintaksa te lastnosti je preprosta. Tukaj je opis, kako bi dodali zamik besedila vsem odstavkom v dokumentu.
p {
zamik besedila: 2em;
}
Prilagajanje zamikov
Na en način lahko natančno določite odstavke za zamike, odstavkom, ki jih želite zamikati, lahko dodate razred, vendar za to morate urediti vsak odstavek, da mu dodate razred. To je neučinkovito in temu ne sledi HTML kodiranje Najboljše prakse.
Namesto tega bi morali razmisliti, ko zamikate odstavke. Odstavke, ki neposredno sledijo drugemu odstavku, zamikate. Če želite to narediti, lahko uporabite sosednji izbirnik brata ali sestre. S tem izbirnikom izberete vsak odstavek, pred katerim je naslednji odstavek.
p + p {
zamik besedila: 2em;
}
Ker zamikate prvo vrstico, se prepričajte tudi, da odstavki med seboj nimajo dodatnega prostora (kar je privzeta nastavitev brskalnika). Slogovno bi morali imeti razmik med odstavki ali zamik prve vrstice, ne pa obeh.
p {
margin-bottom: 0;
oblazinjenje-dno: 0;
}
p + p {
margin-top: 0;
oblazinjenje: 0;
}
Negativne alinee
Uporabite lahko tudi zamik besedila lastnost, skupaj z negativno vrednostjo, povzroči, da gre začetek vrstice v levo in ne v desno kot običajna zamik. To lahko storite, če se vrstica začne z narekovajem, tako da se znak narekovaja prikaže v majhen rob na levi strani odstavka in črke same še vedno lepo levo poravnava.
Recimo, na primer, da imate odstavek, ki je potomec blokovnega citata, in želite, da je negativno zamaknjen. Lahko napišete ta CSS:
blockquote p {
zamik besedila: -.5em;
}
To bi omogočilo, da se začetek odstavka, ki domnevno vključuje začetni citat, nekoliko premakne v levo, da se ustvari viseča ločila.
Glede robov in oblazinjenja
Pogosto pri spletnem oblikovanju uporabljate vrednosti robov ali oblazinjenja za premikanje elementov in ustvarjanje praznega prostora. Vendar te lastnosti ne bodo delovale, da bi dosegle učinek zamaknjenega odstavka. Če katero koli od teh vrednosti uporabite za odstavek, bo celotno besedilo tega odstavka, vključno z vsako vrstico, razmaknjeno namesto samo v prvo vrstico.