logo

Kā pasvītrot tekstu CSS?

CSS teksta dekorēšanas īpašums: -

Pasvītrojumus var izmantot, lai izceltu svarīgu tekstu. U elements un CSS teksta dekorēšanas rekvizīts ir divi visbiežāk lietotie paņēmieni teksta pasvītrošanai tīmekļa lapās.

Abi ir vienkārši lietojami, taču U elements piedāvā nozīmei semantisko vērtību. Cits var tikt parādīts pēc pieprasījuma, padarot vienkāršu pasvītrojuma stāvokļa maiņu, vienkārši pievienojot tekstam CSS klases.

Tas, vai pasvītrojumi ir noderīgi, lai izteiktu nozīmi vai pieejamību, ir diskusiju jautājums. Pasvītrojumi ir dabiska pieeja, lai piedāvātu lielāku lietotāja pieredzi, ja ar krāsu vien nepietiek, lai izteiktu nozīmi.

Teksta dekorācijas atribūts piedāvā alternatīvu veidu, kā pasvītrot tekstu. Hipersaites tekstu var izmantot arī, lai pasvītrojumus aizstātu ar pasvītrojumiem.

Pasvītrojums ir pretējs pasvītrojumam. Teksta augšpusē tiek pievienota rindiņa.

Vienai un tai pašai klases definīcijai mēs varam izmantot visas pasvītrojuma un pasvītrojuma vērtības. Teksta noformējuma rekvizīts nosaka, kā teksts tiek pasniegts vairākos veidos. Ja teksta noformējums ir pasvītrots, komponentā esošais teksts tiek pasvītrots.

Teksta dekorēšanas CSS rekvizīti ir lieliski piemēroti tekstam, taču tie var būt ierobežoti noformējuma ziņā un nav piemērojami satura veidiem, kas nav teksta veidi. Pasvītrojumus var izveidot arī ar CSS apmales atribūtiem.

sistēmas programmatūra

Teksta noformējuma atribūts ir visvienkāršākais teksta pasvītrošanas veids. Būtiskākais teksta dekorēšanas trūkums ir tas, ka tas nav konfigurējams.

Teksta noformējuma rekvizīts izmanto pasvītrojumu, pārslēgšanu, caurlaidību vai līniju kombināciju, lai iezīmētu atlasīto tekstu.

Saturs tiek pasvītrots, izmantojot atribūtu text-decoration-line. Pārsvītrot, pasvītrot un caurstrāvot ir trīs šī atribūta opcijas. CSS atribūts pasvītrojums tiek izmantots, lai izceltu tekstu. Pasvītrojums tiek uzzīmēts zem iekļautā teksta ar šo vērtību.

Pāri pēcnācējiem teksta elementiem tiek zīmēti teksta rotājumi. Tas nozīmē, ka tad, kad elements definē teksta rotājumu, bērnu elements nevar noņemt dekorāciju.

java salīdzināšanas virkne

Nav novilkta neviena līnija, un visi esošie rotājumi tiek dzēsti.

Pasvītrot: 1 pikseļa līnija tiek novilkta pāri teksta bāzes līnijai.

Caurlaide: teksta 'vidējā' punktā ievieto 1 pikseļa līniju pāri.

Overline: pievieno 1 pikseļu līniju tieši virs teksta augšējā punkta visā tekstā.

Mantojums: manto vecāku apdari.

Teksta dekorēšana tiek norādīta, izmantojot teksta dekorēšanas rekvizītu, kas ir īss raksturs:

  • text-decoration-line (obligāti)
  • teksts-dekorācija-krāsa
  • teksts-dekorācijas stils
  • teksts-dekorācija-biezums

overline, pasvītrot, pasvītrot-overline, line-through nāk zem text-decoration-line.

Vienkrāsains, punktēts, svītrots, viļņains, dubults atbilst teksta dekorēšanas stilam.

Krāsa decimālvērtībā, heksadecimālā vērtība vai mantojuma vērtība ir iekļauta sadaļā teksts-dekorācijas krāsa.

Ridhima Tiwari

Apmales-apakšējā rekvizīts ir alternatīva teksta dekorēšanai. Mēs varam izmantot arī apmali, lai nodrošinātu polsterējumu.

Sintakse: -

 text-decoration: text-decoration-line | text-decoration-color | text-decoration-style | text-decoration-thickness 

Tagad meklēsim piemēru un sapratīsim teksta dekorēšanas īpašuma izmantošanu.

Teksta noformējums: pasvītrot pārsegumu

Piemērs: -

 h1 { text-decoration: underline overline dotted purple; } h3 { text-decoration: underline wavy cyan 10px;} <h2>This is an example of text decoration property color using underline overline. </h2> <h3>This is an example of text decoration property color using line-through. </h3> 

Izvade:

Kā pasvītrot tekstu CSS?