HTML szóközök egyszerűen figyelmen kívül hagyja. Kód írásakor a szóköz, az Enter vagy a Tab billentyűt figyelmen kívül hagyja a rendszer. A HTML találatokat szóköz karakterként értelmezi, egyszerűen- kódformázók (karakterek, szavak, szöveg), így nem jelennek meg. Ezért, ha szóközöket kell megjelenítenie, akkor azokat a kódnyelven kell megvalósítania. Olvassa el ezt a cikket, hogy megértse, hogyan bizonyos helyzetekben.

Számos módszer létezik egyetlen szóköz hozzáadására a szöveghez. Egyáltalán nem bonyolultak, és a felhasználónak csak néhány karaktert kell beírnia az erre szolgáló helyre. Nézzük meg részletesen mindegyik módszert.

1. módszer. HTML kód beszúrása - Szúrja be arra a helyre, ahol szóközt szeretnénk kapni. Az "nbsp" egy bizonyos angol kifejezés rövidítése - non breaking space, ami azt jelenti nem törő tér.

Ezt a módszert olyan esetekben érdemes alkalmazni, amikor esztétikai és stílusi okokból a szavak vagy karakterek közé egy vagy két szóközt kell beilleszteni.

Például azzal a feladattal kell szembenéznie, hogy szünetet tartson a szavak között, mondjuk ezt: " Szia. Hogy vagy?". Minden szóközhöz meg kell adnia egy kódot, például: " Szia. Hogy vagy?"

Második módszer. Bekezdés beszúrása HTML-be.

A következő kódrészletet kell beillesztenie

a bekezdésként bemutatandó szöveg előtt.

Kódot kell beilleszteni

minden bekezdés elején.

Minden bekezdés végére illesszen be egy záró címkét, amely így néz ki - . Mivel a bekezdéscímke egy párcímke, nem zárható be.

Harmadik módszer. Lapok hozzáadása a HTML-modul segítségével.

A tabulátor hozzáadásához 4 vagy akár 5 nem törő szóközt kell használni. Ebben az esetben a kód a következő lesz: .

A HTML-ben nincs külön elem a lapokhoz. Ha mindenhol táblázatozást szeretnénk használni az információk könnyebb leolvasása érdekében, akkor mindenképpen érdemes a CSS kódot alaposabban megnézni.

Negyedik módszer. Sortörések hozzáadása a HTML-hez.

Ahol sortörést szeretne létrehozni, az a kód beszúrása
.

Ha egyszerre pár ilyen címkét tesz a szövegbe -

Ez egy sorral lejjebb mozgathatja a szöveget. Ebben a forgatókönyvben az egyik címke eltolja a következő sort, a második pedig kihagyja azt.

Ötödik módszer. Szöveg megjelenítése írott formában HTML használatával

Ha beszúr egy címkét a szöveg elé, akkor az a nyomtatott formában jelenik meg adott formátum. Az ilyen szöveg minden olyan szóközt tartalmaz, amely nem jelenik meg a szokásos kódban. Nyomtatott formátumban a szóköz pontosan ugyanúgy néz ki, mint ha szabványos formátumban helyezné el.

Ebben a cikkben példákon keresztül elemeztük, hogyan lehet szóközt beszúrni a HTML-be. Reméljük, hogy a jövőben nem lesz ebből nehézsége. Sok szerencsét!

Megfelelő szóköz hozzáadása a HTML-ben. Érvényes elrendezés.

Ha megpróbált webhelyeket beírni, akkor valószínűleg tudja, hogy ha néhány szóközt ír be a szövegbe a billentyűzetről, akkor azok nem kerülnek mentésre. A böngészők egyetlen térként kezelik őket. Néha ez elrendezési problémákhoz vezet. Most megmutatjuk, hogyan adhat hozzá több szóközt egymás után.

Speciális karakterek használata

A hipertext jelölőnyelvben egy speciális karaktert használnak, amelyet a böngészők szóközként értelmeznek. Itt van:

Pontosan a fent bemutatott formában kell beírnia. Ha több szóközt kell beszúrnia egy sorba, illesszen be több ilyen karaktert.

Hogyan nézne ki a kódrészletünk, ha három szóközt szeretnénk hozzáadni egymás után.

A kód tesztrésze

Ha megnyitnánk egy ilyen oldalt a böngészőben, a következőt kapnánk:

A kód tesztrésze

előtag

A szöveg nem mindig formázható megfelelő módon szabványos jelölőcímkékkel. Ugyanakkor a billentyűzetről beírva elérheti a kívánt eredményt. De a végén, amikor böngészőben tekinti meg az oldalt, minden kézi formázás leesik, és sima szöveget kap. Ugyanezt az eredményt kapja, ha manuálisan ad hozzá több, nem törő szóközt egymás után, egyszerűen az azonos nevű billentyűre kattintva.

Hogyan lehet ilyen helyzetben lenni?

Íme egy példa hosszú szóközt tartalmazó szövegre. Ezt úgy kaptuk meg, hogy a szöveget egy PRE tag-be zártuk.

Mint látható, több egymást követő sortörés is elmentésre kerül. Ez a címke erre való. Kézi formázást hagy a benne foglalt szöveghez.

Videó a cikkhez:

Következtetés

Ezeket a módszereket csak speciális szövegformázások beszúrásához használja. Ne használja ezeket a módszereket az elemek helyének meghatározására az oldalon. Például, ha több nem törő szóközt ad hozzá, hogy a következő elem az oldal jobb oldalán legyen. Ehhez használjon stíluslapokat.

Sziasztok, a blogoldal kedves olvasói. Kicsit korábban már sikerült beszélnünk arról, hogy mi is megismertük a benne lévő dizájnt. Manapság viszont a HTML-ben a hiányosság fogalma, valamint a hozzá tartozó kód formázása az írás során (a későbbi olvasás és érzékelés kényelme érdekében).

Nos, mivel a szóköz és a lágy elválasztás témáját érinteni fogjuk, figyelmünket a HTML nyelvben használt úgynevezett speciális karakterekre vagy mnemonikákra kell összpontosítanunk, amelyek lehetővé teszik sok további karakter a webdokumentum kódjához, mint például a fentebb említett . De először a dolgok.

Szóközök és szóközök karakterek a HTML nyelvben

Mielőtt rátérnék a kifejezetten erre a célra kialakított címkék (bekezdés, címsor stb.) segítségével történő szövegformázás kérdésére, szeretnék elidőzni a szóközök, sortörések (Enter) és a táblázatok értelmezése a HTML nyelvben. , hogyan történik a lebontás szövege a böngészőablakban átméretezéskor.

Igaz, ehhez a fajta vizuális formázáshoz (ami nem lesz látható a weboldalon) legtöbbször nem magukat a szóközöket használják, hanem a táblázatos és sortörés karaktereket. Van egy ilyen szabály - amikor elkezdi írni a beágyazott html tag, akkor behúzás egy tabulátorral(Tab billentyű a billentyűzeten), és amikor bezárja ezt a címkét, távolítsa el a behúzást (Shift + Tab billentyűkombináció a billentyűzeten).

Ezt úgy kell megtenned, hogy a nyitó és záró címkék azonos függőleges szinten legyenek (a HTML-szerkesztőd lapjának jobb szélétől ugyanannyi lap, pl. Notepad ++, amit írtam ról ről). Ezenkívül azt tanácsolom, hogy a nyitó elem beírása után azonnal tegyen több sortörést, és azonnal írja be a záró elemet ugyanazon a szinten (tabulátorok száma), hogy később ne felejtse el megtenni.

Azok. a nyitó és záró elemek függőlegesen egy szinten legyenek, a belső címkéket pedig egy tabulátor karakterrel eltoljuk és a záró és nyitó elemeket ismét ugyanarra a szintre helyezzük.

Mert egyszerű web dokumentumokat, ez túlzásnak tűnhet, de ha többé-kevésbé bonyolultakat hoz létre, akkor azok a kód sokkal világosabb leszés a szóközök bősége miatt olvasható, illetve a címkék szimmetrikus elrendezése miatt sokkal könnyebben észrevehető lesz benne a hiba is.

Speciális karakterek vagy emlékeztetők a HTML-kódban

Szóval, most beszéljünk az ún speciális karakterek, melynek használhatóságát a cikk elején közöltem. A speciális karaktereket néha mnemonikának vagy helyettesítésnek is nevezik. A hipertext jelölőnyelvben régóta felmerülő, az alkalmazott kódolásokkal kapcsolatos problémát hivatottak megoldani.

Amikor szöveget ír be a billentyűzetről, az Ön nyelvének karakterei egy előre meghatározott algoritmus szerint kódolásra kerülnek, majd a dekódolás miatt az Ön által használt betűtípusok használatával jelennek meg a webhelyen (hol találhatók és hogyan telepíthetők az oldalhoz).

Nagyon sok kódolás létezik, de a HTML nyelvhez alapértelmezés szerint a kódolások kiterjesztett változata került alkalmazásra.

Ebben a szövegkódolásban csak 256 karaktert lehetett leírni - 128 karaktert ASCII-ből és további 128 karaktert orosz nyelvű betűkhöz. Ennek eredményeként probléma lépett fel az olyan karakterek webhelyeken történő használatával kapcsolatban, amelyek nem szerepelnek az ASCII-ben, és nem orosz karakterek, amelyek a Windows 1251 (CP1251) kódolás részét képezik. Nos, eszedbe jutott, hogy tildát vagy aposztrófot használj, és ennek az eredetileg használt lehetőségei HTML nyelv kódolás nincs benne.

Ilyen esetekre találták ki a helyettesítéseket, vagy más szóval a mnemonikát. Alapvetően különleges karakterek voltak digitális nézet rekordokat, de aztán a legelterjedtebbeknél az ábécé szerinti megfelelőjüket adták hozzá, hogy könnyebben megjegyezzék őket.

Általánosságban elmondható, hogy az emlékeztető olyan karakter, amely "&" jellel kezdődik és pontosvesszővel ";" végződik. Ezen az alapon a böngésző a HTML-kód elemzésekor speciális karaktereket von ki belőle. A numerikus helyettesítő kódban szereplő „és” jelet közvetlenül a „#” font jelnek kell követnie, amelyet néha hash-nek is neveznek. És csak ezután következik a kívánt karakter numerikus kódja Unicode kódolásban.

Több mint 60 000 karakter írható le Unicode-ban - a lényeg az, hogy a szükséges mnemonikus szimbólumot támogassa a webhelyén használt betűtípus. Vannak olyan betűtípusok, amelyek szinte az összes Unicode karaktert támogatják, és vannak olyan opciók, amelyek csak bizonyos karakterkészlettel rendelkeznek.

A speciális karakterek teljes listája egyszerűen hatalmas lesz, de leggyakrabban használt mnemonika kölcsönözhet például ebből a táblázatból:

Van egy elég érdekes megszerzésének módja html kódot emlékezeterősítő a szükséges karakterhez. Ehhez elegendő a szerkesztő megnyitása Microsoft Word, hozzon létre egy új dokumentumot, és válassza ki a "Beszúrás" - "Szimbólum" menüpontot a felső menüből (én a 2003-as verziót használom, ezért nem tudom, hogyan kell hasonló műveletet végrehajtani a későbbi verziókban).

A megnyíló ablakban ki kell választania egy betűtípust, például Times New Roman (vagy bármely más, amely minden bizonnyal megtalálható a webhely látogatóinak legtöbb számítógépén - például Courier vagy Arial).

Adja hozzá a megnyíló listából az Ön számára word dokumentum az összes szükséges speciális karaktert, és mentse el ezt a Word-dokumentumot weboldalként (mentéskor a ".html" legördülő listából van kiválasztva). Nos, akkor csak meg kell nyitnia ezt a weboldalt bármelyik Html-szerkesztőben (ugyanaz a Notepad ++ is jó), és látni fogja a szükséges mnemonika összes digitális kódját:

A módszer egy kicsit bonyolult, de ha van kedve valamilyen ritka speciális szimbólumot használni az oldaladon, akkor egyszerűbb lesz, mint a fentihez hasonló táblázatokat keresni az interneten. A kapott speciális karakterkódot a megfelelő helyre kell beillesztenie, és a weblapon helyette a böngésző megjeleníti a szükséges karaktert (például nem törő szóközt).

Törésmentes szóköz és lágy elválasztás a példákban

Ahogy fentebb említettem, és a fenti speciális karakterek táblázatából is látható, néhány HTML-beli mnemonika a digitális mellett szimbolikus jelölést is kapott a könnyebb memorizálás érdekében. Azok. karakterváltozatokban a "#" (hash) font jel helyett szavakat használnak. Például ugyanazt a megszakítás nélküli szóközt vagy mint (digitális mnemonika) vagy (karakter) írhatjuk.

Cikk írásakor, ha „és” jelet (&) vagy nyitott szögletes zárójelet (<), то для этого обязательно нужно использовать спецсимволы. Дело в том, что эти знаки в Html означают начало тега и браузер будет рассматривать их именно с этой точки зрения и отображать в тексте не будет.

Vagyis ha olyan cikket ír, amelyben be kell illesztenie a szövegbe, például a megjelenítési címkét< body>vagy csak egy kisebb, mint jelet kell beszúrni (<), то сделав это без использования подстановок на веб странице вы ничего не увидите, т.к. браузер, обнаружив «<» , поймет, что это Html тег, а не текст статьи.

Ezért egy ilyen probléma megoldásához be kell illesztenie a következő konstrukciót:

Ugyanez vonatkozik maguknak a mnemonikák kódjának megjelenítésére is, mivel azok és jellel kezdődnek. Kódot kell beszúrnia a szövegbe, az "és" jel helyettesítésével (speciális karakter):

Ezt meg kell tenni, hogy felkerüljön az oldalra<, а не отображение левой угловой скобки (<), в которую преобразует браузер мнемонику <, обнаружив при разборе знак амперсанда. Хитро, но вы все поймете попробовав это на практике.

Ezenkívül nagy valószínűséggel nem törő szóközt fog használni, amely úgy néz ki, mint egy normál szóköz a weboldalon, de a böngésző egyáltalán nem kezeli szóközként, és nem fog átmenni rajta(Például ez olyan kifejezésekre lenne megfelelő, mint 1400 GB stb., amelyeknél nem lenne kívánatos kötőjelet vinni a különböző sorok fölé):

1400 GB.

Néha az ellenkező helyzet adódhat, amikor nagyon hosszú szavak vannak a szövegben, és meg akar győződni arról, hogy szükség esetén a böngésző áthelyezéssel megtörhetné ezeket a szavakat. Ilyen célokra egy speciális "soft transfer" szimbólum található -

Hosszú, hosszú szó;

Amikor szükségessé válik egy másik sorra váltás, a böngésző kötőjelet helyez el a lágy tördelésű emlékeztető helyett, és a szó többi részét a következő sorba küldi. Ha van elég hely ahhoz, hogy egy sorban elférjen ez a szó, akkor a böngésző nem húz új sort. Ennyi, egyszerű.

Sok szerencsét! Hamarosan találkozunk a blogoldalak oldalán

További videókat nézhet meg, ha felkeresi

Lehet, hogy érdekel

MailTo - mi ez, és hogyan lehet e-mail hivatkozást létrehozni HTML-ben
A H1-H6 címsorok, a Hr vízszintes vonal, a Br sortörés és a P bekezdés címkéi és attribútumai a Html 4.01 szabvány szerint
Hivatkozás és kép (fotó) beszúrása HTML-be - IMG és A címkék

Ami?

A html-ben sok különböző címke, attribútum, érték található, amelyeket különféle helyzetekben használnak. Néhányat csak a rendeltetésüknek megfelelően használnak, mások rugalmas beállításokkal rendelkeznek, amelyek lehetővé teszik a különféle változatok használatát. A szokásos címkéken kívül a html-nek vannak speciális mnemonikus karakterei is. Segítségükkel a felhasználók képernyőjén különböző ikonokat, ikonokat stb. Az egyik leghasznosabb speciális karakter a nem törő szóköz. Ezt az elemet ebben a cikkben tárgyaljuk.

Célja

A html-ben a nem törő szóköz sokféle helyzetben használható. Ennek az elemnek a leggyakoribb használata a karakterek vagy szavak közötti térköz természetes növelése. Lehet, hogy néhányan már felháborodnak, és feltesznek egy logikus kérdést: „Miért nem használunk egy normál szóközt a billentyűzet szóköz gombjával?”. A tény az, hogy a böngésző figyelmen kívül hagy minden extra szóközt a szavak vagy karakterek között, kivéve az első hozzárendelt szóközt. Függetlenül attól, hogy hány lesz belőlük az oldal forráskódjában, továbbra is csak egy jelenik meg. Így, ha két vagy több szóközt szeretne egymás után elhelyezni, akkor speciális karaktert kell használnia. Ezenkívül vannak más esetek is, amikor ezt az elemet használják, például:

• Piros vonal. Bár az új bekezdések ilyen megjelenítési módját ritkán használják az interneten, mégis hasznos tudni, hogy ha több szóközt tesz az elején, akkor behúzás effektust kap.
• Asztal. Előfordul, hogy egy asztal építésénél üres cellák jelennek meg, amelyeket ki kell tölteni valamivel, különben az egész szerkezet deformálódik emiatt. Alternatív megoldásként elhelyezhet egy nem törő szóközt. Ekkor a felhasználók egy üres cellát fognak látni, és a táblázat a régiben marad.
• Rajzok a figyelem felkeltésére. Ezzel az elemmel szimbólumokból képet építhet. Vagy néha egy ilyen teret használnak a felhasználók figyelmének összpontosítására.

Alkalmazás

A nem törő html szóközt speciális karakterek, nevezetesen "" írásával lehet hozzárendelni. Azaz, ha ezt a bejegyzést beillesztjük a forráskódba, további intervallumot kapunk. Hossza megegyezik a szokásos térrel. A "" bejegyzés a "NO-BREAK SPACE" kifejezést jelenti, ami "nem megszakító szóközt" jelent. Használhatja a " " alternatív jelölést, amely ugyanazt a hatást adja.

Sajátosságok

Ennek az elemnek a megkülönböztető jegyei közé tartozik, hogy ha ilyen szóközt tesz két szó (karakter) közé, akkor minden esetben ugyanazon a sorban marad. Egyes esetekben egy vízszintes görgetősáv jelenik meg (amikor az elemek eltűnnek a képernyőről). Néha a fejlesztők csak e funkció miatt használják ezt az elemet. Például amikor nagyon fontos, hogy a szöveg egy sorban legyen.

Következtetés

A legtöbb esetben a nem törő hely használhatatlan. Mivel ritkán szükséges hosszú intervallumot beállítani. De így vagy úgy, ismerni kell ezt az elemet. Végül is egy nap minden html fájlok fejlesztőjének jól jön.

Mindenki, aki megpróbálta weboldalak létrehozása HTML-ben ilyen problémával szembesült. Szinte minden HTML címkék vágjon ki extra szóközöket. És ezúttal adok egy példát erre a "kivágásra", és azt is elmondom, hogyan ügyelj arra, hogy ne legyenek kivágva a szóközök.

Kezdjük egy egyszerű írással HTML kód:

Néhány szöveg Folytatás...

Ha megnézi az eredményt, látni fogja, hogy az összes helyet kivágták, és csak egy maradt meg. És így van szinte minden címke.

Három lehetőség van extra szóközök megjelenítése HTML-ben. Az első módszer a címke használata<elő>:

Néhány szöveg Folytatás...

Ennek eredményeként látni fogja, hogy a hiányosságok megmaradnak, és pontosan ezt akartuk.

De van egy másik módszer is, amelyet rendszeresen használok - a "" entitás. Ez az entitás egyszerűen lecseréli a szóköz karaktert:

Néhány szöveg Folytatás...

Ennek eredményeként egy egész sor teret is láthat majd. Számomra ez a módszer jobb, mert nincs szükség extra címkék használatára. De ez ízlés dolga. Ahol szükséges extra hely a html-ben, csak illessze be a "" elemet, és élvezze az eredményt.

És végül az utolsó út CSS használat. Ehhez csak hozzá kell adnia ezt a stílust:

P(
szóköz: pre;
}

Ez a módszer a leggyorsabb és legegyszerűbb, de nem használom, mivel gyakorlatomban kevés az olyan eset, amikor sok egymást követő szóközt kell hozzáadnom. És ha előfordulnak, akkor többször használom a " " entitást. Továbbá, üres térbeli ingatlan nem minden böngésző támogatja (különösen IE6és IE7 nem támogatják), ami már korlátozza ennek a módszernek a hatókörét.

Általánosságban összefoglalom:

1) Ha a szöveg bármely része sok szóközt tartalmaz különböző helyeken, akkor használja a címkét<elő>.

2) Ha van valahol egyetlen pillanat, amikor több szóközre van szüksége egymás után, akkor használja a "  ";

3) Ha az egész oldalt egy csomó egymást követő szóközből szőtték (bár ez rendkívül ritka), akkor használja a tulajdonságot fehér űr jelentéssel elő.

Ha többet szeretne tudni róla HTML, majd tekintse meg ingyenes tanfolyamomat egy weboldal létrehozásának példájával a címen HTML: