Tabulátor szóköz több meg nem törő szóköz helyett („ ”)?

Tabulator Szokoz Tobb Meg Nem Toro Szokoz Helyett Nbsp



A webfejlesztés során a szóközöket a HTML dokumentumokban a „   ” entitáskódot, amelyet nem törő szóköznek is neveznek. Egyes esetekben több, nem törő szóközt kell hozzáadni a dokumentumhoz, például a tabulátorközt. Ezért több „ ” Az entitáskódok befolyásolhatják a dokumentum kódsorrendjét és tisztaságát.

Ezeknek a problémáknak a megoldására számos más módszer is létezik több, nem törő szóköz beillesztésére a HTML-dokumentumban, például '

   ”, „      ' elemek, CSS '   margó-bal   ”, „   padding-bal   ” ingatlanok, és még sok más.

Ez a tanulmány megtanítja Önnek:







Először egy példán keresztül fogunk végigmenni, amely megvalósítja   ” szóközök hozzáadásához a HTML-dokumentumban. Ezután fokozatosan menjen végig az illusztrációkon, hogy bemutassa a tabulátorok hozzáadásának különböző módszereit.



Szóközök hozzáadása a „ ” használatával entitáskód HTML-ben?

Szóközök hozzáadásához a „   ” a HTML oldalon, kövesse a megadott lépéseket:



  • Adjon hozzá egy div elemet, és rendeljen hozzá egy osztályt ' cikk ”.
  • Ezt követően helyezzen el egy „

    ” elemet a címsorhoz.

  • Ezután adja hozzá a „

    ” elemet egy bekezdés hozzáadásához. A bekezdés elejére a szóközök az entitáskód megadásával egészülnek ki   ”:

< div osztály = 'cikk' >
< h2 > A tudás hatalom < / h2 >
< p >     A tudás hatalom azt jelenti, hogy a művelt ember a tudás erején keresztül teljes mértékben irányítja életét. < / p >
< / div >

Látható, hogy a szóközök sikeresen hozzáadva a bekezdés elején:





Hogyan adjunk hozzá tabulátorterületet a HTML „” elem használatával?

A HTML ' ” egy soron belüli elem, amelyet a dokumentum egy részének megjelölésére használnak. A folyamatban lévő példában hozzáadtuk a elemet a „ lapon ” id. Ezt az elemet úgy alakították ki a CSS-ben, hogy helyet hozzon létre:



< div osztály = 'cikk' >
< h2 >A tudás hatalom< / h2 >
< p > < span id = 'lap' >< / span > A tudás hatalom azt jelenti, hogy egy művelt ember a tudáson keresztül teljes mértékben irányítja életét ereje.


Stílus „cikk” div

.cikk {
margó: autó;
szélesség : 400 képpont;
padding: 10px;
}

Az ' .cikk ' a '

” címkéket, amelyet ezután a következő tulajdonságokkal alkalmazunk:

  • ' szélesség ” tulajdonság határozza meg az elem szélességét.
  • ' árrés ” tulajdonság határozza meg az elem magasságát.
  • ' párnázás ” teret generál az elem tartalma körül.

Stílus „lap” azonosítója

#tab {
padding-bal: 8px;
}

Az ' #tab ' elérheti a ' lapon ” a elem azonosítóját, és alkalmazza a „ padding-bal ” ingatlan rajta.

Kimenet

Hogyan adjunk hozzá tabulátorterületet a HTML „
” elem használatával?

Az '

   ” elem határozza meg az előre formázott szöveget. A 
 elemen belüli szöveg úgy jelenik meg a weboldalon, ahogy van.

Tekintse át a példát a HTML oldal létrehozásával:

  • Add hozzá a '

    ” elemet a dokumentum második szintű címsorának beállításához.

  • Ezután adja hozzá a „
       ” címkét, és adja meg a tartalmat a kívánt formázással:
< h2 >HTML pre Tag< / h2 >
< elő >
függvény termékFunkció ( p1, p2 ) {
vissza p1 * p2;
}
< / elő >

Kimenet

Hogyan adjunk hozzá tabulátorterületet a CSS „margin-left” tulajdonság használatával?

Tabulátorhely hozzáadása a CSS használatával ' margó-bal ” ingatlan, kövesse a megadott eljárást:

  • Először adjon meg egy div elemet a dokumentumhoz, és rendeljen hozzá egy osztályt ' képeket ”.
  • A div elemen belül adjon hozzá további két div elemet az osztályhoz img-1 ” és „ img-2 ” ill.
  • E két div elem mindegyike tartalmaz képeket, amelyeket a ' ” címke.
  • Ezek ' ' címkék a ' src ” és „ szélesség ” attribútumokat. Az „src” attribútum a kép URL-jét adja meg, a „width” attribútum pedig a kép szélességét állítja be.

Íme a fent tárgyalt forgatókönyv HTML-kódja:

< div osztály = 'képek' >
< div osztály = 'img-1' >
< img src = '/spring-images/marguerite-flower.jpg' szélesség = '250' >
< / div >
< div osztály = 'img-2' >
< img src = '/spring-images/flower-ga8f105f1d_1920.jpg' szélesség = '250' >
< / div >
< / div >

A HTML oldal így fog kinézni:

Lépjünk a CSS szakasz felé, hogy több szóközt adjunk a „ img-2 ” osztályban többszörös, nem törő szóköz használata nélkül.

Stílus „képek” div

.képek {
szélesség : 500 képpont;
margó: autó;
}

Az ' .képek ' a HTML div eléréséhez használható, amely tartalmazza a ' képeket ' osztály. A fent említett tulajdonságok magyarázata a következő:

  • ' szélesség ” tulajdonság határozza meg az elem szélességét.
  • ' árrés ” tulajdonság határozza meg az elem oldalai körüli teret.

Stílus „img-2” div
Nyissa meg a div elemet a „ .img-2 ”:

.img- 2 {
margó balra: 30 képpont;
}

Az ' margó-bal ' ingatlan egy ' 30 képpont ' érték kerül alkalmazásra a '' osztályú HTML div elemre img-2 ”. Ez a tulajdonság 30 képpontnyi helyet ad az elem bal oldalán.

Itt az eredmény azt mutatja, hogy a második kép az elején némi szóközzel kerül alkalmazásra:

Kidolgoztuk a tabulátorok hozzáadását a többszörös, megszakítás nélküli szóköz használata helyett '   ”.

Következtetés

A HTML-ben a „   ” entitáskódot általában arra használnak, hogy a dokumentumban törésmentes szóközt helyezzenek el. Az entitáskód többszöri használatának elkerülése érdekében más módszerek is vannak tabulátorok hozzáadására a dokumentumban. Ezek a módszerek közé tartozik a HTML használata

   ”, „      ' elemek, '   margó-bal   ” ingatlan, és még sok más. Ez a blog több olyan módszert is megemlített, amelyek segítségével több „ ” hozzáadása helyett tabulátorokat adhatunk a HTML-dokumentumhoz. entitáskódok.