Apskatiet, kā pārlūkprogrammas apstrādā HTML atstarpi
Ja esat sākums tīmekļa dizainers, viena no daudzajām lietām, kas jums būs jāsaprot agri, ir veids, kā tīmekļa vietņu pārlūkprogrammā apstrādā vietnes koda atstarpes.
Diemžēl veids, kā pārlūkprogrammas apstrādā balto laukumu, vispirms nav ļoti intuitīvi, it īpaši, ja jūs nonākat HTML un salīdzina to, kā tekstu apstrādes programmās tiek izmantotas baltas vietas, kuras jūs varētu labāk iepazīties.
Teksta apstrādes programmatūrā dokumentā var ievietot lielu atstarpi vai cilnes, un atstarpes tiks atspoguļotas dokumenta satura displejā. Tas neattiecas uz HTML vai tīmekļa lapām. Tādējādi ļoti svarīgi ir uzzināt, kā balta telpa patiešām tiek izmantota tīmekļa pārlūkprogrammās.
Spacing in Print
Teksta apstrādes programmatūrā trīs galvenās atstarpes rakstzīmes ir atstarpes, cilnes un veltņu atgriešanās. Katra no šīm darbībām izpaužas atšķirīgā veidā, bet pārlūkprogrammā HTML tas viss ir vienāds. Neatkarīgi no tā, vai savā HTML marķējumā ievietojat vienu atstarpi vai 100 atstarpes vai arī sajaucat atstarpi ar cilnēm un kastītes atgriezeniskām saitēm, visas tās tiks saīsinātas līdz vienai vietai, kad pārlūka lapa tiek iztulkota. Web dizaina terminoloģijā tas ir pazīstams kā balto laukumu sabrukums. Jūs nevarat izmantot šos tipiskos atstarpes taustiņus, lai tīmekļa lapā pievienotu atstarpes taustiņu, jo pārlūkprogrammā pārlūks tiek izkliedēts vairākās vietās tikai vienā vietā,
Kāpēc kāds izmanto cilnes?
Parasti, kad cilvēki izmanto teksta dokumentā cilnes, tie tos izmanto izkārtojuma apsvērumu dēļ vai lai tekstu pārvietotu uz noteiktu vietu vai noteiktu attālumu no cita elementa. Tīmekļa dizainā nevar izmantot iepriekšminētos kosmosa rakstus, lai sasniegtu šos vizuālos stilus vai izkārtojuma vajadzības.
Tīmekļa dizaina koda papildu atstarpes zīmju izmantošana būtu tīri vienkāršota, lai lasītu šo kodu. Web dizaineri un izstrādātāji bieži lieto cilnes koda ievilkšanai, lai viņi varētu redzēt, kuri elementi ir citu elementu bērni, taču šie ievilkumi neietekmē lapas vizuālo izkārtojumu. Viņiem, kam vajadzīgas vizuālās izkārtojuma izmaiņas, jums vajadzēs vērsties pie CSS (kaskādes stila lapas).
CSS izmantošana, lai izveidotu HTML cilnes un atstarpes
Mūsdienās tīmekļa vietnes ir veidotas, veidojot struktūru un stilu. Lapas struktūru apstrādā HTML, kamēr stils tiek diktēts ar CSS. Tas nozīmē, ka, lai izveidotu atstarpi vai sasniegtu noteiktu izkārtojumu, jums vajadzētu vērsties pie CSS un nevis mēģināt vienkārši pievienot atstarpes rakstzīmes HTML kodam.
Ja mēģināt izmantot cilnes, lai izveidotu teksta slejas, varat izmantot, lai iegūtu šo kolonnu izkārtojumu, izmantojot elementus
Ja dati, kurus jūs izstrādājat, ir tabulas dati, varat izmantot tabulas, lai tos pielāgotu, kā vēlaties. Tabulas bieži sastopas ar sliktu reputu web dizainā, jo tos tik daudzus gadus izmanto kā tīru maketēšanas rīku, taču tabulas joprojām ir pilnīgi derīgas, ja jūsu saturs satur iepriekš minētos tabulas datus.
Margins, polsterējums un teksta atkāpe
Visbiežāk sastopamo veidu, kā izveidot atstarpi ar CSS, ir viens no šādiem CSS stiliem:
- rezervi
- polsterējums
- teksta ievilkums
Piemēram, varat ievilkt rindiņas pirmo rindiņu, piemēram, cilni ar šādu CSS (ņemiet vērā, ka tas nozīmē, ka jūsu rindiņam ir pievienots "pirmais" klases atribūts):
p.first {
teksta ievilkums: 5em;
}
Šim punktam tagad būtu ievilkta aptuveni 5 rakstzīmes.
CSS var izmantot arī starpposma vai polsterējuma rekvizītus, lai pievienotu atstarpi elementa augšējai, apakšai, pa kreisi vai pa labi (vai to kombinācijām). Galu galā jūs varat sasniegt jebkura veida atstarpi, kas nepieciešams, pagriežot uz CSS.
Teksta pārvietošana vairāk nekā vienā telpā bez CSS
Ja vēlaties, lai jūsu teksts tiktu pārvietots vairāk nekā vienu atstarpi no iepriekšējā posteņa, varat izmantot nepārtrauktās vietas.
Lai izmantotu nesalaužamo vietu, vienkārši pievienojiet & nbsp; tik daudz reižu, cik tas jums nepieciešams jūsu HTML atzīmēšanā.
Piemēram, ja vēlaties pārvietot savu vārdu uz piecām atstarpēm, pirms vārda varat pievienot šādus.
& nbsp; & nbsp; & nbsp; & nbsp; & nbsp;HTML ievēro šos principus un nesaburs tos vienā telpā. Tomēr tas tiek uzskatīts par ļoti sliktu praksi, jo dokumentam tiek pievienota papildu HTML iezīme tikai, lai sasniegtu izkārtojuma vajadzības. Atsaucoties uz šo struktūras un stila nošķiršanu, nevajadzētu pievienot nepārblīvējamas vietas, lai iegūtu vēlamo izkārtojuma efektu, un tā vietā būtu jāizmanto CSS maržas un polsterējums.