Struktura gotovo svake web stranice koju pronađemo i koristimo na webu stvorena je pomoću HTML-a, standardiziranog sustava za kategorizaciju tekstualnih datoteka. Prijelomi stranica, odlomci, jaka slova, kurziv i druge značajke dodaju se pomoću HTML-a. Upotrebom oznaka, koje preglednicima upućuju kako da rukuju sadržajem, HTML pomaže u stvaranju ove strukture.

Na primjer, stavili bismo riječ između oznaka strong>bold/strong> kako bi izgledala podebljano. Oznaka za otvaranje (/) označava gdje želimo da bold završava, dok prva oznaka (/) označava gdje želimo da bold počinje. Služi kao temelj za većinu web stranica. Dakle, ovo je mjesto za početak ako učite kodirati.

Kako dodati prostor u HTML

Osim jednog razmaka između riječi, svi prazni razmaci koje unosimo u HTML tekst za prikaz u pregledniku se zanemaruju. Kao rezultat toga, moramo programirati prazne prostore koje želimo u našem dokumentu. Svaki redak teksta može imati razmak u HTML-u. Na primjer, možemo umetnuti prazna mjesta u sadržaj tablice i odlomka pomoću HTML objekta. Budući da HTML-u nedostaje slovo na tipkovnici za prazan prostor, moramo unijeti entitet da bismo dodali svaki razmak.

Možda se čini jednostavno, ali dodavanje prostora u naš HTML može biti izazovno. Postoji najmanje pet različitih pristupa rješavanju ovoga.

Tijekom ove obuke vidjet ćemo mnoge primjere. Također će pokazati kako iskoristiti složenije oblike prostora.

niz znakova java

Sve je to moguće u običnom HTML-u bez upotrebe CSS-a. Ali imajte na umu da je dodavanje prostora u vaš HTML najbolje učiniti putem CSS-a.

Kako izgleda ASCII razmak?

Razmak je predstavljen ASCII simbolom 20. Ali to je samo prihvaćena praksa.

Postoji pet različitih vrsta prostora koje možete koristiti u HTML-u. Nevještom oku izgledaju identično, iako imaju donekle različite funkcije.

Znak tabulator, koji simulira pritiskanje tipke tab na tipkovnici, još je jedna opcija. A znak za povratak na početak reda, koji simulira pritiskanje tipke enter na tipkovnici, još je jedan primjer.

Neprekidni prostor:

U svemiru:  

Em razmak:  

Tanak prostor:

Standardni prostor:

Nova linija (povratak):

Tab znak:

Lijeva strana predstavlja lik , a desna strana predstavlja HTML kôd.

Koliko je širok lik u prostoru?

Za razmake postoje četiri standardne širine:

Prostor standardne širine:Budući da neće rezultirati prijelomom retka (također poznatom kao povratak na novi red), ovo je također poznato kao 'razmak bez prijelaza retka'.Em razmak:Ovo se zove 'Em' jer je, bez obzira na tip slova koji koristite, iste širine kao i slovo M. (Ako smo čuli za izraz 'em-crtica', onda znamo o čemu govorimo.)U svemiru:Ovo je poznato kao 'En' jer ima istu širinu kao slovo n u vašem pismu.Tanak prostor:Najuži od svih prostora je 'tanak prostor', koji je zadnja opcija.

Što znači znak za razmak u HTML-u?

je najrašireniji HTML entitet.

arraylist java

Kako bi ovaj tekst ispunio prostor, pokušajte ga baciti.

Zamislimo, na primjer, da želimo dodati dva razmaka nakon fraze, ali mehanizam za renderiranje web stranice sam uklanja jedan od razmaka. Da dodamo dva razmaka, možda bismo mogli ući

Razmak: što je to?

Znakovi koji nisu vidljivi nazivaju se razmaci. Sastoje se od:

1. prostori,
2. kartice, i
3. prijelomi retka (povratak na novi red, pomak retka ili oboje),

Zašto je ovo ključno?

Ova slova, na primjer, nisu vidljiva u programu za obradu teksta, ali utječu na prostor i oblikovanje teksta. Preglednik sažima brojne razmake u jedan razmak u HTML-u, koji se razlikuje od ostalih jezika za označavanje.

Postoji nekoliko razmaka između riječi u ovom HTML-u, a svaki redak završava znakovima CRLF (povratak na početak, novi redak). Preglednik će smanjiti sve razmake.

Primjer

Za dobre stvari treba više vremena.

Izlaz:

Umetanje razmaka

1. Upotrijebite znak neprekinutog razmaka ( ) za dodatni razmak.
2. Svojstvo CSS padding može se koristiti za povećanje prostora unutar elementa u različitim okolnostima.
3. CSS atribut margine omogućuje dodavanje dodatnog prostora oko elementa.

Iako su neprekinuti razmaci korisni, ne bi se trebali pretjerano koristiti jer bi to moglo ometati način na koji se materijal prikazuje u preglednicima. Osim toga, suzdržite se od korištenja neprekinutih razmaka u stilske svrhe kao što je uvlačenje ili centriranje elementa na web stranici; stilskim zahtjevima umjesto toga treba upravljati putem CSS-a.

Osim entiteta, HTML također podržava sljedeće dodatne entitete za brojne susjedne prazne prostore:

Entitet znaka   koristi se za predstavljanje razmaka. En je mjerna jedinica koja je ekvivalentna 8 piksela ili polovini širine em-a (16 piksela).

Sintaksa za en razmak između sadržaja je   Evo primjera kako koristiti HTML &ensp entitet:

Ovdje je primjer za entitet en svemir.

Izlaz:

Entitet   koristi se u gornjem primjeru za dodavanje razmaka u HTML, a njegova širina je 8 piksela. Mogu se koristiti i na nekoliko susjednih lokacija.

Održavanje oblikovanja i razmaka

Ako želite zadržati formatiranje i razmake koji su navedeni, postoje dvije mogućnosti:

1. Dodavanje HTML oblikovanja i prostora
2. Korištenje a

    tag.

Korištenje oznake 'pre'

Ovi ishodi nastaju zamjenom

oznaka za

 tag:

Primjer

 pre> Good things take more time 

Izlaz:

Da,

 tag keeps the formatting as it was originally, but it also switches to a monospaced typeface. All of these can be fixed; however, using the <pre> tag isn&apos;t always the best option. HTML spacing is a more popular method.</pre>

Dodavanje HTML oblikovanja i prostora

Kao alternativu, možemo uključiti HTML elemente i simbole kao što su sljedeći:

inurl:.git/head

Dobre stvari hoće

uzeti više vremena.

Izlaz:

Prijelom retka zahtijeva
element.

Neprekidni prostor:

Preglednik ne sažima razmake dodane neprekinutim znakom razmaka ().

Osim toga, kao što ime sugerira, sprječava preglednik da tamo razdvoji dvije riječi.

Za dobre stvari treba više vremena.

Izlaz:

U ovom modelu dodaje se 10 razmaka na početku teksta. Drugi se stavlja između ' uzima ' koji neće biti izoliran kada se rečenica prelomi zbog ograničenja prostora.

Atribut Padding

Unutarnji prostor elementa povećava se s CSS atributom padding.

Uzima vrijednosti u rasponu od jedan do četiri, počevši od gornje, desne, donje i desne strane.

The 'div' element ima ispunu od 20 piksela sa svih strana.

 Inner spacing is 20px with a div attribute 

Izlaz:

Atribut margine

1. S atributom CSS margine dodaje se dodatni prostor oko elementa.
2. Uzima vrijednosti u rasponu od jedan do četiri, počevši od gornje, desne, donje i desne strane.

The 'div' element ima marginu od 40 piksela sa svih strana.

kako pristupiti icloud fotografijama

 Outer spacing is 20px using the div and margin attribute 

Izlaz:

Padding vs Margin

1. Ispuna i margina povećavaju prostor elementa.
2. Ispuna ostavlja prazninu koja se smatra sastavnim dijelom elementa.
3. Prostor stvoren marginom smatra se postojećim izvan granica elementa.
4. Ova varijacija utječe na područje klika, boje pozadine i druge atribute web stranice.

Netko bi mogao povjerovati da je dodavanje razmaka u HTML jednako jednostavno kao stalno pritiskanje razmaknice. Ali stvari jednostavno ne funkcioniraju tako. Pritiskom na razmaknicu više od jednom nećete dodati više obližnjih praznina kao što bi to bilo u tekstualnom dokumentu. Preglednik će kombinirati sve obližnje prazne prostore u jedan ako to učinimo u HTML-u. Kako bismo pokazali što se događa kada koristimo nekoliko razmaka u HTML-u, pogledajmo primjer:

Dakle, nakon mnogo puta korištenja razmaknice, ne možemo dodati još praznih mjesta

Izlaz:

Uzastopnim pritiskanjem razmaknice u HTML-u, kao što se vidi u gornjem primjeru, pokušavamo umetnuti brojne uzastopne prazne prostore na web stranicu. Međutim, preglednici prikazuju više susjednih praznih mjesta kao jedan razmak i zanemaruju razmake prije, poslije i izvan komponenti. Fenomen je poznat kao kolaps razmaka. Iako smanjivanje razmaka ponekad može biti neugodno, postoji nekoliko tehnika za dodavanje više razmaka u HTML-u i CSS-u (kaskadni listovi stilova).

&

Entitet znakova   koristi se za predstavljanje em prostora. Širina em, koja iznosi 16 piksela, ekvivalentna je emsp.

Sintaksa za em razmake u tekstu je   Evo primjera kako koristiti HTML &emsp entitet:

Evo primjera za njihov prostorni entitet.

Izlaz

  Entitet se u gornjem primjeru koristi za dodavanje razmaka u HTML, a njegova širina je 16 piksela. Također se mogu koristiti u nekoliko susjednih prostora.

&thinsp

Entitet znakova koristi se za predstavljanje tankog prostora, često poznatog kao uski prostor. Jedna šestina em je širina &

Tanki razmak napisan je kao sadržaj između u sintaksi. Ovdje je primjer kako koristiti HTML entitet ' '

css komentar

Ovo je primjer entiteta tankog prostora.

Izlaz

Entitet se u gornjem primjeru koristi za dodavanje tankih razmaka u HTML, a njegova je širina jedna šestina em. Također se koriste u nekoliko susjednih prostora.

Ispod je ASCII slika 'Bok'. # # ##### # # # ##### # # # # # # # # # # #####

Izlaz:

Prednosti korištenja razmaka

Razumljivost proširenog sadržaja:Kada su klijenti na našoj stranici, trebali bi imati mogućnost vidjeti kamo idu kako bi dobili motivaciju za nastavak pregledavanja. Iskreno govoreći, razmak između odlomaka i oko blokova teksta i slika pomaže pojedincima u razumijevanju onoga što pregledavaju i pridonosi vrhunskom iskustvu klijenta općenito.Više suradnje:Možemo li biti stvarni, gosti su sigurno u žurbi dok pregledavaju lokalitete, a puno praznina će povećati vezu sprječavanjem prekida koji usporavaju gosta. Doista, čak i neznatno ublažavanje oko predmeta uzrokovat će da primijetimo određeno područje na našoj stranici. Prema istraživanju koje je vodio Human Elements Worldwide, bijeli prostor povećava spoznaju za gotovo 20%.Sposobnost isticanja poziva na radnju (CTA):Povremeno, najjasniji način da se nešto izdvoji je učiniti stvari većim. Možemo povećati slike ili gumbe. Unatoč tome, obuhvaćanje stvari razmakom može biti jednako održivo.Čisto web mjesto ekvivalentno je web mjestu vrijednom pažnje:Početni dojam naše stranice jako je važan. Tona izvanredno jakih dizajna, velika raznolikost planova - ovaj veliki broj komponenti doprinosi dojmu koji stranica ostavlja; međutim, razmak je posebno značajan jer pokazuje spretnost i snalažljivost. Praznina ne čini vašu web-lokaciju izloženom niti umjerenom. Bez obzira koliko se dugi razmak koristio na pravi način, to će vašoj web stranici dodati dojam uglađenosti i rasprostranjenosti.Stvaranje ravnoteže:Premalo razmaka uzrokuje nered, nered i klimavost - karakteristike koje vam nisu potrebne u vezi sa slikom vaše web stranice. S druge strane, mnogo bijelih prostora moglo bi predstavljati nedostatak sadržaja i nedostatak smjernica klijenta. Ključno je prilagoditi svoje planove i pustiti razmak kao nevjerojatan instrument za izolaciju grudica sadržaja za jednostavnu otvorenost i dodatno razvijeno iskustvo klijenta.Otprilike kao separator:Praznina izolira nebitne komponente u planu. Obično se koristi za izoliranje slika ili dizajna jedne od drugih i radi na vašem općem vizualnom formatu. Korištenje legitimnog razmaka čini jasniju korespondenciju misli i uvjerljivih planova.

Zašto su razmaci važni?

Praznina je temeljni element dobrog dizajna, po mom mišljenju kao dizajnera. Dizajneri se pozivaju na negativni prostor, ili prostor između dijelova u kompoziciji, kada koriste izraz 'bjelina'. To je prazan prostor između grafika, margina i oluka na stranici koji nije ničim označen. Razmak između stupaca, redaka teksta i slika oku daje prostor za vizualno disanje.

Postoji uvjerljiv razlog zašto je razmak ključna komponenta dizajna. Može revolucionirati dizajn naše web stranice i pružiti mu nekoliko prednosti ako se pravilno primijeni. Moramo proizvoditi i stvarati izglede koji su ugodni oku i potiču čitatelje da nastave. Ključno je stalno imati na umu da je isporuka fantastičnog proizvoda našim klijentima naš prioritet kada dizajniramo za web.

Praznina se može koristiti za vođenje čitatelja od jednog elementa do drugog, stvaranje sklada i ravnoteže i pomoć pri brendiranju dizajna. Naši ključni ciljevi su učiniti web stranicu jednostavnom i jasnom te pružiti sadržaj koji će se našim korisnicima svidjeti i cijeniti. Prazan prostor nije samo 'prazan' prostor; to je značajka dizajna koja omogućuje postojanje stavki na stranici. Područje uspostavlja ravnotežu i služi kao stalni podsjetnik da postoje lijepi dizajni. Da bismo prenijeli jasnu poruku, ne moramo napraviti izgled koji je preopterećen tekstom i grafikom.