Razlike med blokovnimi in vgrajenimi elementi

HTML je sestavljen iz različnih elementov, ki delujejo kot gradniki spletnih strani. Vsak od teh elementov spada v eno od dveh kategorij: elementi na ravni bloka ali vrstni element. Razumevanje razlike med tema dvema elementoma je pomemben korak pri oblikovanju spletnih strani.

Elementi blokovne ravni

Kaj je torej element na ravni bloka? Element na ravni bloka je element HTML, ki začne novo vrstico na spletni strani in razširi celotno širino razpoložljivega vodoravnega prostora nadrejenega elementa. Ustvari velike bloke vsebine, kot so odstavki ali delitve strani. Pravzaprav je večina elementov HTML elementov na ravni blokov.

Elementi na ravni bloka se uporabljajo v telesu dokumenta HTML. Vsebujejo lahko vstavljene elemente, pa tudi druge elemente na ravni bloka.

Vstavljeni elementi

V nasprotju z elementom na ravni bloka, vrstni element:

Začne se lahko znotraj črte.
Ne začne nove vrstice.
Njegova širina se razteza le toliko, kolikor jo določajo oznake.

Primer vstavljenega elementa je

instagram viewer

, zaradi česar je pisava besedilne vsebine v krepkem tisku. Vstavljeni element običajno vsebuje samo druge vstavljene elemente ali pa sploh ne vsebuje ničesar, na primer
break tag.

V HTML-ju obstaja tudi tretja vrsta elementov: tisti, ki sploh niso prikazani. Ti elementi zagotavljajo informacije o strani, vendar se ne prikažejo, ko so upodobljeni v spletnem brskalniku.

Na primer:

definira metapodatke.
je element dokumenta HTML, ki vsebuje te elemente.

Preklapljanje vrst in vrst blokov

Tip elementa lahko spremenite iz vrstice v blok ali obratno z uporabo ene od teh lastnosti CSS:

```
zaslon: blok; 
```
```
zaslon: v vrstici; 
```
```
zaslon: noben;
```

The CSS lastnost zaslona vam omogoča, da spremenite lastnost vrstice v blok ali blok v vrstico, ali ne prikazati nasploh.

Kdaj spremeniti lastnost zaslona

Na splošno pustite lastnost zaslona pri miru, vendar so v nekaterih primerih koristne zamenjave lastnosti vrstice in bloka zaslona.

Meniji vodoravnega seznama: Seznami so elementi na ravni bloka, če pa želite, da se meni prikaže vodoravno, morate seznam pretvoriti v element v vrstici, tako da se vsak element menija ne začne v novi vrstici.
Glave v besedilu: Včasih boste morda želeli, da glava ostane v besedilu, vendar ohranite vrednosti glave HTML. Če spremenite vrednosti h1 do h6 v vrstice, bo besedilo, ki prihaja po zaključni oznaki, še naprej teklo poleg njega v isti vrstici, namesto da bi se začelo v novi vrstici.
Odstranjevanje elementa: Če želite element popolnoma odstraniti iz dokumenta normalni pretok, lahko zaslon nastavite na
```
nobenega
```
Ena opomba, pri uporabi zaslona bodite previdni: nobene. Čeprav bo ta slog resnično naredil element neviden, tega nikoli ne želite uporabiti za skrivanje besedila, ki ste ga dodali zaradi SEO, vendar ne želite prikazati obiskovalcem. To je zanesljiv način, da vaše spletno mesto kaznuje zaradi pristopa k SEO s črno kapo.

Pogoste napake pri oblikovanju vstavljenih elementov

Ena najpogostejših napak, ki jih naredi novinec pri spletnem oblikovanju, je poskus določitve širine vdelanega elementa. To ne deluje, ker širina vstavljenih elementov v polju vsebnika ni določena.

Vstavljeni elementi prezrejo več lastnosti:

```
premer
```
in
```
višina
```
```
največja širina
```
in
```
največja višina
```
```
najmanjša širina
```
in
```
min-višina
```

Microsoft Internet Explorer (ki ga je nadomestil Microsoft Edge) je v preteklosti nekatere od teh lastnosti napačno uporabljal celo za vrstice. To ni v skladu s standardi. To morda ne velja za novejše različice Microsoftovega spletnega brskalnika.

Če morate določiti širino ali višino, ki naj jo zavzame element, jo boste želeli uporabiti za element na ravni bloka, ki vsebuje vaše besedilo v vrstici.