Névjegyzék

Hogyan lehet aláhúzni a HTML-t. Aláhúzott HTML szöveg. vagy megtanulja a címkék formázása HTML szöveget

Üdvözlet mindazoknak, akik új ismereteket vágynak, és elolvassák a blogomat. A mai közzététel nagyon könnyű témát szeretne szentelni, amely azonban rendszeresen számos kérdést hív ki az újonnan érkezőkből: "Hogyan lehet eltávolítani vagy hozzáadni az alsó aláhúzott HTML-t."

Amennyire már tudja, az alsó aláhúzás manuálisan állítható be, de a linkeket alapértelmezés szerint telepítik. Ezért emlékeztetni fogok arra, hogy emlékeztessem arra, hogyan kell feltenni egy aláhúzás címsorát, megmondom, hogyan kell telepíteni az alsó vonalat a blokk teljes szélességére, valamint hogyan kell kezelni a linkek standard formázását. Nos, kezdjünk!

És gyere, itt hangsúlyozva!

Vannak speciális pár címke a szöveg aláhúzáshoz: szó.

A professzionális versek azonban a Style Cascading asztalok mechanizmusait használják, vagyis CSS, mindent megtervezése érdekében. És igaza van. Ez a megközelítés megosztja a stilizációs jelölést, rugalmas és kényelmes formázást tesz lehetővé. Ezenkívül könnyebb elkapni a hibákat (hibákat) a kódban.

A szöveges tartalom aláhúzásához az ilyen tulajdonságokat főként használják: határ. és szöveges dekoráció..

Elem határ. Felelős a keret felszereléséért a megadott blokk körül, és lehetővé teszi a vonalvastagság és a stílus beállítását.

Ez az egység elég rugalmas, mivel megadhatja a határok egyedi oldalainak formázását. Ez a tulajdonságok segítségével érhető el:

  1. hATÁR-jobb (jobb oldalon)
  2. hATÁR-top. (felülről)
  3. hATÁR-bal. (bal)
  4. hATÁR-alsó (alsó)
Is határ. Beállíthatja:
  • dot ( pontozott.)
  • pontozott ( szaggatott.)
  • lineáris ( szilárd)
  • kettős ( kettős.)
  • hangerő keretezőblokkok ( horony,be van zárva,ridge I.kezdet.)

Ne felejtsük el, hogy mindig megismételheti a szülő blokk stílusának beállításait egy kulcsszóval örököl..

Most vitatjuk meg a CSS nyelvi tulajdonát szöveges dekoráció.. Ez az elem felelős a további szövegdíszekért.

Ezek tartalmazzák:

  1. villog ( pislogás.)
  2. soron át ( túllép)
  3. keresztezett tárgyak ( Áthaladás.)
  4. stilizáció örökség ( örököl.)
  5. törölje az összes további díszeket ( egyik sem)
  6. szükségünk van egy aláhúzásra ( aláhúzás)

Ez az idő gyakorlat

Most azt akarom, hogy biztosítsa a megszerzett ismereteket, és gyakorlatilag tesztelte az általam adott programkód példáját. Azok számára, akik ismerik ezt a témát, akkor is hasznos lesz. Mint mindannyian tudjuk: "Az ismétlés a tanítás anyja!".

Ez a kód végrehajtja a hivatkozások módosított stilizációját, és a blokk teljes szélességét is beállítja az aláhúzás.

Aláhúzás

Kastély szöveg aláhúzott cím

Ez a blokk fontos szöveget tartalmaz valamilyen leírással, és hivatkozás az első erőforrásra a pontozott aláhúzással. Most leírjuk a második linket a szabványos aláhúzás és a szín eltávolításával.


Ezen a megjegyzésben befejezem a képzési kiadványt. Megvizsgálja az összes szükséges eszközt, hogy aláhúzza a szöveges tartalmat, tudva, hogy melyeket hozhat létre weboldal oldal tervezési lehetőségeinek.

Ne felejtsd el csatlakozni az előfizetők soraihoz, mert még mindig sok érdekes és hasznos téma van, és megosztja a Link blogot a barátaival. Viszlát!

Tisztelettel, Roman Chuechev

A HTML aláhúzott szövegét a címke segítségével kiemelik u. HTML (a szóból aláhúzás). A következőképpen kerül alkalmazásra (a szöveg kívánt része a címkék között van elhelyezve ):

Tervező webhelyek "Nubex"

Azonban ez a kód tartják intumeless, ezért sokkal hatékonyabban és helyesen használni a CSS-stílusok szöveg tájat.

Hangsúlyozza a szöveget - CSS-t

Ahogy már a cikkben beszéltünk, a szöveges tájat az ingatlan segítségével állapítják meg. szöveges dekoráció.. Az aláhúzott szöveget a paraméter határozza meg aláhúzás:

Alulteljesített szöveg CSS-vel - "Nubex"

Tervező webhelyek Nubex "



A szöveg hangsúlyozása CSS nem csak szilárd vonalat használ. Nézzük meg, milyen lehetőségeket tudsz hangsúlyozni:

  • Szöveg a szöveg pontozott CSS: Stresszelt pontozott vonal - "Nubex"

    Tervező webhelyek Nubex "



  • Kiemelő pontok: A szöveg által aláhúzott szöveg - "Nubex"

    Tervező webhelyek Nubex "



  • Dupla funkció: Két vonalbeli szövegben hangsúlyozta - "Nubex"

    Tervező webhelyek Nubex "



Amint a fenti példákból látható, az aláhúzási stílust az ingatlan használatával vezérelheti határ alsó. (alsó sor). Ezzel a paraméterrel beállíthatja az aláhúzás, a szín, a vastagság típusát.

Lehetővé teszi, hogy a HTML alacsonyabb (aláhúzás), a felső (túlvonalú), a szöveg (áthaladó), stb. Kompatibilis ez a chip az előzővel, és fog működni:

A második sorban megmutatjuk, hogy mindent egy sorban rögzítenek szöveges dekorációval.

szöveges dekoráció-stílus - Szöveg aláhúzás

Az opció beállítja a / referencia dekoratív vonal megjelenését. Az új CSS-ajánlásokban hullámos és kettős értékeket adtunk hozzá, most csak 5:

  • szilárd - szilárd vonal;
  • kettős - kettős (a fenti példához);
  • pontozott - pontok sorrendjéből áll;
  • szaggatott - lehetővé teszi, hogy szaggatott aláhúzás css;
  • hullámos - látványos hullámos vonal.

szöveg aláhúzás-pozíció - A CSS aláhúzás helyezése

Ennek a tulajdonságnak a segítségével ellenőrizheti a vonal pozícióját a Glyph betűtípushoz képest.
Összesen 4 lehetőség áll rendelkezésre:

  • auto - a szöveg lehetséges szövegének megfelelően helyezkedik el;
  • alatt - a betűtípus legalacsonyabb határán;
  • balra és jobbra - balra / jobbra a függőlegesen megjelenített bejegyzésekhez.

Itt van a vizuális különbség az alsó aláhúzott szöveg között az Alul és Auto:

A különbség, azt hiszem, teljesen nyilvánvaló.

szöveges dekoráció-Skip - Elemek eltávolítása az elemek számára

Az opció használatával törölheti (átugorhatja) a HTML-karakterlánc egyes elemeinek díszítését. Ahhoz, hogy jobban megértsük a szóközök, objektumok, dobozok díszítésének, élek érvényes értékeit, a festéket, a képet megismételjük az utolsó megjegyzésből:

Vagyis például a tinta segítségével, akkor az alacsonyabb aláhúzott CSS-t végezheti, amely nem haladna át a karakterekkel. Az objektumok értéke lehetővé teszi, hogy kihagyja a belső elemek (inline-block) - betét SPAN, és a folytonos vonal megszakad a megfelelő helyre:

A box-dekoráció, terek, élek paraméterei sokkal rosszabbak a böngészők által, így az eredményük néha eltér a vártattól. Itt van egy kompatibilitási / támogatási állapot a szöveges dekoráció a cikk írásakor:

További zsetonok az aláhúzáshoz

A kezdőknek a felhasználók gyakran kérdéseket tesznek fel a témában, ezért úgy döntöttünk, hogy figyelembe veszik őket. Az általános példa a magyarázat után nagyon alul van.

Az Underscore Referencia eltávolítása

v: Hover (szöveges dekoráció: aláhúzás;)

Mindkét példa az alábbiak lehetővé teszik, hogy megértsük a munka logikáját, amikor lebegnek: Vagy kezdetben a CSS aláhúzás referenciáiban jeleznek, majd eltávolítják a lebegést, vagy fordítva.

Ha vannak más kérdések a témában, kérdezze meg őket a megjegyzésekben. Megpróbáljuk később megfontolni, vagy javasoljuk a válaszokat. A legfontosabb dolog ebben az ügyben a gyakorlat - próbálja hozzá különböző tulajdonságokat a szöveges dekorációs opcióhoz közvetlenül a példákban, vagy hozzon létre saját tesztfájlot. Reméljük, hogy a szöveg aláhúzza és a CSS / HTML linkjei világossá vált.

Underscore a blokk elemekhez, mint a címke

Tölthetsz kettőt. Például egy sor a szöveg alatt van telepítve a blokk teljes szélességére, függetlenül a szöveg mennyiségétől. És az aláhúzás csak a szövegben is. Ezután tekintse meg mindkét lehetőséget.

Vonal alatt a szöveg teljes szélességét a blokk

A szöveg alatti vonal létrehozásához adja hozzá a határ alsó stílusú tulajdonságát az elemhez, értéke egyidejűleg a vonal vastagsága, stílusa és színe (1. példa).

1. példa Az egész szélességre sor

HTML5 CSS 2.1 IE CR OP SA FX

Vonal a fejléc alatt

Minta szöveg



A vonalhoz való távolság a szöveghez a Padding-alsó tulajdonság segítségével a H1 választó hozzáadásával állítható be. A példa eredményét az 1. ábrán mutatjuk be. egy.

Szöveg aláhúzás

A szöveg hangsúlyozásához a szöveges dekorációs tulajdonságot az aláhúzással kell használni, ismét hozzá kell adni a H1 választóhoz (2. példa).

2. példa A szöveg szélességére

HTML5 CSS 2.1 IE CR OP SA FX

Aláhúzódó fejléc

Minta szöveg

A fekete fejléc vonzza a figyelmet, annak ellenére, hogy fekete, nem fehér.



A példa eredményét az 1. ábrán mutatjuk be. 2.

A szöveges dekorációs tulajdonság használata esetén a vonal mereven kötődik a szöveghez, így nem lehet meghatározni pozícióját és stílusát.



Tetszett a cikket? Oszd meg