Si të krijoni HTML hapësirë ​​të bardhë

Krijo hapësirat dhe ndarjen fizike të elementeve në HTML me CSS

Krijimi i hapësirës dhe ndarja fizike e elementeve në HTML mund të jetë e vështirë për tu kuptuar për projektuesin e fillimit të internetit. Kjo është për shkak se HTML ka një pronë të njohur si "kolaps i hapësirës së bardhë". nëse ju shkruani 1 hapësirë ​​ose 100 në kodin HTML, shfletuesi web automatikisht bie këto hapësira në vetëm një hapësirë ​​të vetme. Kjo është e ndryshme nga një program si Microsoft Word , i cili lejon krijuesit e dokumenteve të shtojnë hapësirë ​​të shumëfishta për të ndarë fjalët dhe elementët e tjerë të atij dokumenti.

Kjo nuk është mënyra se si hapësira e dizajnit të faqeve të internetit funksionon.

Pra, si i shtoni hapësira të bardha në HTML që shfaqen në faqen e internetit ? Ky artikull shqyrton disa nga mënyrat e ndryshme.

Hapësira në HTML me CSS

Mënyra e preferuar për të shtuar hapësira në HTML është me Cascading Style Sheets (CSS) . CSS duhet të përdoret për të shtuar ndonjë aspekt vizual të një faqeje interneti, dhe që ndarja është pjesë e karakteristikave vizuale të një faqeje, CSS është vendi ku dëshiron që kjo të bëhet.

Në CSS, ju mund të përdorni ose diferencën ose padding pronat për të shtuar hapësirë ​​rreth elementeve. Përveç kësaj, prona e tekst-indent shton hapësirë ​​në pjesën e përparme të tekstit, si për të futur paragrafët.

Këtu është një shembull se si të përdoret CSS për të shtuar hapësirë ​​para të gjitha paragrafëve tuaj. Shto CSS-në e mëposhtme në fletën tuaj të stilit të jashtëm ose të brendshëm :

p {
teksti-indent: 3em;
}

Hapësira në HTML: Brenda Tekstit Tuaj

Nëse vetëm doni të shtoni një hapësirë ​​ose dy shtesë në tekstin tuaj, mund të përdorni hapësirën që nuk thyhet.

Ky karakter vepron ashtu si një karakter hapësinor standard, vetëm se nuk ka rënë brenda shfletuesit.

Këtu është një shembull se si të shtohen pesë hapësira brenda një rreshti të tekstit:

Ky tekst ka pesë hapësira shtesë brenda saj

Përdor HTML:

Ky tekst ka & nbsp; & nbsp; & nbsp; & nbsp; pesë hapësira shtesë brenda saj

Gjithashtu mund të përdorësh etiketën
për të shtuar ndërprerje shtesë të linjës.

Ky fjali ka pesë ndërprerje në fund të saj









Pse Ndarja në HTML është një ide e keqe

Derisa këto opsione të dyja punojnë - elementët e hapësirës që nuk shkelen, do të shtojnë hapësirë ​​në tekstin tuaj dhe ndërprerjet e linjës do të shtojnë ndarjen nën paragrafin e treguar më lart - kjo nuk është mënyra më e mirë për të krijuar hapësira në faqen tuaj. Shtimi i këtyre elementeve në HTML tuaj shton informacionin vizual në kodin në vend të ndarjes së strukturës së një faqe (HTML) nga stilet vizuale (CSS). Praktikat më të mira diktojnë që këto duhet të jenë të ndara për një numër arsyesh, duke përfshirë lehtësimin e azhurnimit në të ardhmen dhe madhësinë e përgjithshme të skedarëve dhe performancën e faqes.

Nëse përdorni një fletë të stilit të jashtëm që të diktojë të gjitha stilet dhe ndarjet tuaja, atëherë ndryshimi i këtyre stileve për të gjithë sitin është i lehtë për t'u bërë, pasi thjesht duhet të përditësoni atë fletë stilesh.

Konsideroni shembullin e mësipërm të fjalisë me pesë tags në fund të tij. Nëse dëshironi që sasia e hapësirës në fund të çdo paragrafi, do të duhet të shtoni kodin HTML në çdo paragraf në tërë faqen tuaj. Kjo është një sasi mjaftë e markup shtesë që do të fryj faqet tuaja.

Përveç kësaj, nëse vendosni poshtë rrugës që kjo hapësirë ​​është shumë ose shumë pak dhe dëshironi të ndryshoni pak, do të duhet të redaktoni çdo paragraf të vetëm në të gjithë webfaqen tuaj. Jo faleminderit!

Në vend që të shtoni këto elemente ndarëse në kodin tënd, përdor CSS.

p {
mbushje-fund: 20px;
}

Kjo linjë e CSS do të shtonte ndarje sipas paragrafëve të faqes tënde. Nëse dëshironi të ndryshoni atë ndarje në të ardhmen, modifikoni këtë rresht (në vend të kodit të tërë të faqes tuaj) dhe jeni të mirë për të shkuar!

Tani, në qoftë se keni nevojë të shtoni një hapësirë ​​të vetme në një pjesë të faqes suaj, duke përdorur një tag
ose një hapësirë ​​të vetme që nuk është thyer, nuk është fundi i botës, por duhet të jeni të kujdesshëm.

Përdorimi i këtyre opsioneve spacing HTML në linjë mund të jetë një shpat rrëshqitës. Ndërsa një ose dy nuk mund të dëmtojnë faqen tuaj, nëse vazhdoni poshtë atë rrugë, do të futni probleme në faqet tuaja. Në fund, ju jeni më mirë duke u kthyer në CSS për ndarjen e HTML, dhe të gjitha nevojat vizuale të tjera të faqeve web.