Pažiūrėkite, kaip naršyklėse elgiasi "baltos vietos" HTML
Jei esate pradedantysis interneto dizaineris, vienas iš daugelio dalykų, kuriuos turėsite suprasti anksčiau, yra būdas, kodėl svetainės kodą užpildo naršyklės.
Deja, tai, kaip naršyklės tvarko baltą erdvę, iš pradžių nėra labai intuityvios, ypač jei įeinate į HTML ir palyginsite tai, kaip su tekstu tvarkymo programomis, apie kurias gali būti geriau susipažinęs, naudojama baltoji erdvė.
Teksto apdorojimo programoje galite pridėti daug tarpų ar skirtukų dokumente, o tarpas bus atsispindėtas dokumento turinio ekrane. Tai nėra su HTML ar tinklalapiais. Kaip tokia, labai svarbu sužinoti, kaip balta erdvė iš tiesų tvarkoma žiniatinklio naršyklėmis.
Tarpas Spausdinti
Teksto apdorojimo programoje trys pagrindiniai simboliai yra erdvės, skirtuko ir vežimėlio grąža. Kiekvienas iš jų veikia skirtingu būdu, bet HTML, naršyklės iš esmės tas pats. Nesvarbu, ar į HTML žymėjimą įterpiate vieną erdvę ar 100 vietos, ar sumaišykite tarpą su skirtukais ir vežimėlio grąžinais, visi jie bus sutrumpinti iki vienos vietos, kai naršyklė pateikia puslapį. Web dizaino terminologijoje tai vadinama "baltos vietos" žlugimu. Jūs negalite naudoti šių tipinių tarpų klavišų pridėti tarpinį klavišą tinklalapyje, nes naršyklė sugadina keletą erdvių į vieną erdvę, kai ji pateikiama naršyklėje,
Kodėl kas nors naudoja skirtukus?
Paprastai, kai žmonės naudoja skirtukus teksto dokumente, jie naudoja juos išdėstymo sumetimais arba norėdami persikelti į tam tikrą vietą arba būti tam tikru atstumu nuo kito elemento. Interneto dizainui negalima naudoti minėtų kosminių simbolių, kad būtų pasiekti šie vizualūs stiliai ar išdėstymo poreikiai.
Naudojant interneto dizainą, papildomų tarpų simbolių naudojimas kodeje būtų tik tam, kad būtų lengviau skaityti šį kodą. Interneto svetainių kūrėjai ir kūrėjai dažnai naudoja skirtukus įtraukimo kodui, kad jie galėtų pamatyti, kurie elementai yra kitų elementų vaikai, tačiau tie įtraukimai neturi įtakos vizualiai puslapio išdėstymui. Tiems, kuriems reikia vizualaus išdėstymo pakeitimų, reikės kreiptis į CSS (kaskadinio stiliaus lapus).
CSS naudojimas HTML skirtukų ir tarpų sukūrimui
Svetainės šiandien yra pastatytos su struktūros ir stiliaus atskyrimu. Puslapio struktūra tvarkoma HTML, o stiliaus diktuoja CSS. Tai reiškia, kad norint sukurti tarpą arba pasiekti tam tikrą išdėstymą, turėtumėte kreiptis į CSS, o ne bandyti paprasčiausiai pridėti tarpų ženklus į HTML kodą.
Jei bandote naudoti skirtukus, kad sukurtumėte teksto stulpelius, vietoj to naudokite
Jei pateikiami duomenys yra lentelės duomenys, galite naudoti lenteles, kad galėtumėte juos sulyginti. Lentelės dažnai būna netinkamos reklamos žiniatinklyje, nes jos buvo piktnaudžiaujamos kaip grynos maketavimo priemonės tiek daugelį metų, tačiau lentelės vis dar yra visiškai tinkamos, jei jūsų turinys turi minėtus lentelės duomenis.
Margins, užtrauktukas ir teksto įtraukimas
Dažniausi būdai, kaip sukurti tarpą su CSS, yra naudojant vieną iš šių CSS stilių:
- marža
- pamušalas
- teksto įtrauka
Pavyzdžiui, galite įrašyti pirmąją pastraipos eilutę kaip skirtuką su šia CSS (atkreipkite dėmesį į tai, kad jūsų pastraipoje priskiriamas pirmojo klasės atributas):
p.first {
teksto įtrauka: 5em;
}
Ši pastraipa dabar būtų įtraukta apie 5 ženklus.
CSS taip pat galite naudoti paraščių ar padengimo savybes, kad elementas būtų pridėtas tarpai elemento viršuje, apačioje, kairėje arba dešinėje (arba jų kombinacijos). Galiausiai galite pasiekti bet kokį tarpą, reikalingą sukant CSS.
Teksto perkėlimas daugiau nei vienoje erdvėje be CSS
Jei norite tik tai, kad jūsų tekstas būtų perkeltas daugiau nei vienos vietos atstumu nuo ankstesnio elemento, galite naudoti nesibaigiančią erdvę.
Jei norite naudoti nesudėtingą erdvę, tiesiog pridėkite & nbsp; tiek kartų, kiek reikia, savo HTML žymeklį.
Pavyzdžiui, jei norėtumėte perkelti žodį penkis kartus, prieš žodį galite pridėti šiuos žodžius.
& nbsp; & nbsp; & nbsp; & nbsp; & nbsp;HTML laikosi šių nuostatų ir neapsaugo jų iki vienos vietos. Tačiau tai laikoma labai bloga praktika, nes dokumente papildomas HTML žymėjimas pridedamas tik siekiant išdėstymo poreikių. Grįžęs prie šio struktūros ir stiliaus atskyrimo, neturėtumėte pridėti nepaliekančių erdvių, norėdami pasiekti pageidaujamą išplanavimo efektą, o vietoje to turėtumėte naudoti CSS paraštes ir užpildas.