Szükséges eszközök
A HTML igazítás fogalmának kifejtéséhez meg kell említenünk néhány szükséges eszközt a HTML kód futtatásához. Az egyik egy szövegszerkesztő, a másik egy böngésző. Szövegszerkesztő lehet jegyzettömb, fenséges, jegyzettömb ++, vagy bármi más, ami segíthet. Ebben az útmutatóban a jegyzettömböt, a Windows alapértelmezett alkalmazását és a Google Chrome -ot használtuk böngészőként.
HTML formátum
Az összehangolás megértéséhez először rendelkeznünk kell bizonyos ismeretekkel a HTML alapjairól. Bemutattuk a mintakód képernyőképét.
< html >
< fej >...</ fej >
< test >….</ test >
</ html >
A HTML két fő részből áll. Az egyik a fej, a másik a test. Minden címke szögletes zárójelbe van írva. A fejrész a html oldal elnevezésével foglalkozik a cím címke használatával. És használd a fej belsejében található stílusnyilatkozatot is. Másrészt a törzs a szöveg, képek vagy videók stb. Összes többi címkéjével foglalkozik, más szóval, bármit, amit hozzá szeretne adni a html -oldalához, a html törzsrészébe írja.
Egy dolgot kell itt kiemelnem, a címke nyitása és zárása. Minden megírt címkét be kell zárni. Például a Html kezdőcímkével rendelkezik, a befejező pedig. Tehát megfigyelhető, hogy a befejező címke perjelekkel rendelkezik, majd a címke neve. Hasonlóképpen, az összes többi címke is ugyanezt a megközelítést követi. Ezután minden szövegszerkesztő mentésre kerül a html kiterjesztéssel. Például egy példa.html nevű fájlt használtunk. Ezután látni fogja, hogy a jegyzettömb ikon böngésző ikonra változott.
Mivel az igazítás a stílus tartalma. A html stílus három típusból áll. In-line stílus, belső és külső stílus. Inline a címkében. A belső a fej belsejébe van írva. Ugyanakkor a külső stílus külön CSS -fájlba van írva.
A szöveg soron belüli stílusa
1. példa
Itt az ideje, hogy itt tárgyaljunk egy példát. Tekintsük a fenti képet. A jegyzettömb fájljába egy egyszerű szöveget írtunk. Amikor böngészőként futtatjuk, akkor az alábbi kimenetet fogja megjeleníteni a böngészőben.
Ha azt akarjuk, hogy ez a szöveg jelenjen meg a központban, módosítjuk a címkét.
Ez a címke egy soron belüli címke. Ezt a címkét akkor írjuk meg, amikor bevezetjük a bekezdéscímkét a html törzsébe. A szöveg után zárja be a bekezdéscímkét. Mentse el, majd nyissa meg a fájlt a böngészőben.
A bekezdés középen igazodik, ahogy a böngészőben is megjelenik. A példában használt címke bármilyen igazításhoz használható, azaz balra, jobbra és középre. De ha csak a középen lévő szöveget szeretné igazítani, akkor erre a célra egy speciális címkét használ.
< központ > …… ..</ központ >A középső címkét a szöveg előtt és után használják. Ez is ugyanazt az eredményt fogja mutatni, mint az előző példa.
2. példa
Ez egy példa arra, hogy a html szövegben a bekezdés helyett a címsort kell igazítani. A címsor illesztésének szintaxisa ugyanaz. Ez történhet mind a címkén keresztül, mind pedig soron belüli stílussal, vagy az igazítási címke hozzáadásával a fejléccímkében.
A kimenet megjelenik a böngészőben. A fejléccímke az egyszerű szöveget címsorrá alakította, és a címke középre igazította.
3. példa
Igazítsa a szöveget középre
Tekintsünk egy példát, amelyben egy bekezdés jelenik meg a böngészőben. Ezt kell középre igazítanunk.
Ezt a fájlt megnyitjuk a jegyzettömbben, majd a címke segítségével igazítjuk középső helyzetbe.
< o stílus =szöveg-igazítsa: központ;>Miután hozzáadta ezt a címkét a bekezdéscímkéhez, mentse a fájlt, és futtassa a böngészőben. Látni fogja, hogy a bekezdés most középre igazítva van. Lásd az alábbi képet.
Igazítsa a szöveget jobbra
A szöveg jobbra hajlítása hasonló az oldal közepére. Csak a középső szót váltja jobbra a bekezdéscímke.
< o stílus =szöveg-igazítsa: igaz;> ...........</ o >A változások az alábbi képen láthatók.
Mentse és frissítse a weboldalt a böngészőben. A szöveg most az oldal jobb oldalára került.
A szöveg belső stílusa
1. példa
Amint azt fentebb leírtuk, a belső css (lépcsőzetes stíluslap) vagy a belső stílus olyan css -típus, amely az oldal html fejrészében van meghatározva. Hasonlóan működik, mint a belső címkék.
Tekintsük a fent látható oldalt; a címeket és a bekezdést tartalmazza benne. Követelmény, hogy a szöveget középen lássuk. A soron belüli igazítás megköveteli a címkék kézi írását minden bekezdésbe. De a belső stílus automatikusan alkalmazható a szöveg minden bekezdésére, ha megemlíti a p -t a stílusnyilatkozatban. Ezután nem kell semmilyen címkét írni a bekezdéscímkébe. Most figyelje meg a kódot, és működik.
< stílus >P{Szöveg-igazítsa: központ}
</ stílus >
Ez a címke a fejrész stíluscímkéjébe van írva. Most futtassa a kódot a böngészőben.
Amikor végrehajtja az oldalt a böngészőben, látni fogja, hogy az összes bekezdés az oldal közepére van igazítva. Ez a címke a szövegben található minden bekezdésre vonatkozik.
2. példa
Ebben a példában, akárcsak egy bekezdést, a szöveg összes címsorát a jobb oldalhoz igazítjuk. Ebből a célból megemlítjük a fej belsejében található stílusnyilatkozat címsorát.
H2, h3{
Szöveg-igazítsa: jobb
}
A fájl mentése után futtassa a jegyzettömb fájlt a böngészőben. Látni fogja, hogy a címsorok a HTML oldal jobb oldalán vannak igazítva.
3. példa
Belső stílus esetén előfordulhat, hogy csak néhány bekezdés szövegét kell igazítani a szövegben, míg mások ugyanazok maradnak. Ezért az osztály fogalmát használjuk. Bemutatjuk az osztályt egy pont módszerrel a stíluscímkén belül. Szükség van az osztály nevének hozzáadásához az igazítani kívánt bekezdéscímkén belül.
< stílus >.központ{
Szöveg-igazítsa: központ}
</ stílus >
osztály =központ> ……</ o >
Az első három bekezdéshez hozzáadtuk az osztályt. Most futtassa a kódot. A kimeneten látható, hogy az első három bekezdés középen van igazítva, míg mások nem.
Következtetés
Ez a cikk elmagyarázta, hogy az igazítást különböző módon lehet elvégezni a soron belüli és a belső címkék segítségével.