HTML elementai: bloko lygio ir įterptieji elementai
Degui Adil / EyeEm / Getty Images
HTML yra sudarytas iš įvairių elementų, kurie veikia kaip tinklalapių sudedamosios dalys. Kiekvienas iš šių elementų patenka į vieną iš dviejų kategorijų: bloko lygio elementus arba įterptinį elementą. Suprasti skirtumą tarp šių dviejų tipų elementų yra svarbus žingsnis kuriant tinklalapius.
Bloko lygio elementai
Taigi, kas yra bloko lygio elementas? Bloko lygio elementas yra HTML elementas, kuris tinklalapyje pradeda naują eilutę ir išplečia visą turimos pagrindinio elemento horizontalios erdvės plotį. Jis sukuria didelius turinio blokus, pvz., pastraipas ar puslapių skaidymus. Tiesą sakant, dauguma HTML elementų yra bloko lygio elementai.
HTML dokumento turinyje naudojami bloko lygio elementai. Juose gali būti įtrauktų elementų, taip pat kitų bloko lygio elementų.
Įterpti elementai
Priešingai nei bloko lygio elementas, eilutinis elementas:
- Jis gali prasidėti vienoje eilutėje.
- Ji nepradeda naujos eilutės.
- Jo plotis tęsiasi tik tiek, kiek jį apibrėžia žymos.
Inline elemento pavyzdys yra , todėl teksto turinio šriftas yra paryškintas. Eilutiniame elemente paprastai yra tik kiti įterptieji elementai arba jame gali būti iš viso nieko, pvz.,
sulaužyti žymą.
Taip pat yra ir trečio tipo HTML elementai: tie, kurie visai nerodomi. Šie elementai pateikia informaciją apie puslapį, bet nerodomi, kai pateikiami žiniatinklio naršyklėje.
Pavyzdžiui:
- apibrėžia stilius ir stilių lenteles.
- apibrėžia meta duomenis.
- yra HTML dokumento elementas, kuriame yra šie elementai.
Inline ir Block elementų tipų perjungimas
Galite pakeisti elemento tipą iš eilutinio į bloką arba atvirkščiai, naudodami vieną iš šių CSS ypatybių:
- |_+_|
- |_+_|
- |_+_|
The CSS rodymo ypatybė leidžia pakeisti eilutę į bloką arba bloką į eilutę arba nerodyti iš viso.
Kada pakeisti ekrano ypatybę
Apskritai palikite rodymo ypatybę ramybėje, tačiau kai kuriais atvejais gali būti naudinga pakeisti įterptąsias ir blokines rodymo ypatybes.
- |_+_| ir |_+_|
- |_+_| ir |_+_|
- |_+_| ir |_+_|
Dažnos įterptųjų elementų formatavimo klaidos
Viena iš dažniausiai pasitaikančių klaidų, kurias daro naujokas žiniatinklio dizaino srityje, yra bandymas nustatyti įterpto elemento plotį. Tai neveikia, nes įterptinių elementų pločiai neapibrėžiami konteinerio langelyje.
Įterptieji elementai nepaiso kelių savybių:
„Microsoft Internet Explorer“ (pakeista „Microsoft Edge“) anksčiau neteisingai pritaikė kai kurias iš šių savybių net įterptoms dėžutėms. Tai neatitinka standartų. To gali nebūti naudojant naujesnes „Microsoft“ žiniatinklio naršyklės versijas.
Jei reikia apibrėžti plotį arba aukštį, kurį elementas turėtų užimti, norėsite tai pritaikyti bloko lygio elementui, kuriame yra įterptinis tekstas.