Att betona ett dokument eller en text anses alltid vara lätt. Men om vi överväger fallet för webbplatserna, är det enkelt än? De flesta av oss skulle säga ja men att göra en horisontell linje inklusive vissa anpassade mönster gör den här enkla uppgiften tröttsam. Låt starta resan med textdekoration med CSS på följande sätt:
hur man kontrollerar palindrom i java
- Vad är textdekoration?
- Typer av textdekorationer i CSS
- Textdekoration med CSS: kod
- Textdekoration Hoppa över
Vad är textdekoration?
Det sätter utseendet på dekorativa linjer på text. Det är en stenografisk fastighet för:
- text-dekor-linje
- text-dekoration-färg
- text-dekoration-stil
Det anges som ett eller flera rymdavgränsade värden som representerar den långa handen text-dekorationsegenskaper.
Syntax:
text-dekoration: || ||
Var,
text-dekoration-rad: Den används för att ställa in vilken typ av dekoration som används, t.ex.understrykning, överstrykning och genomgång.
text-dekoration-färg:Den används för att ställa in färgen på dekorationen.
text-dekoration-stil: Den används för att ställa in stil på linjen somsolid, vågig, prickad, streckad, dubbel
Typer av textdekorationer i CSS
- Overline:
#decoration {text-decoration: overline} 
- Linje genom:
#decoration {text-decoration: line-through}- Understrykning:
#decoration {text-decoration: underline}- Kombination:
#decoration {text-decoration: underline line-through overline}Produktion:
Textdekoration med CSS: kod
Koda:
CSS-kod:
#overline {text-decoration: wavy overline lime} # underover {text-decoration: dashed underline overline} # doted {text-decoration: underline overline doted red} # wavy {text-decoration: line-through wavy}Produktion:
Textdekoration Hoppa över
En egenskap som kallas text-dekoration-hoppa kan också användas där en text överlinje, genomstreckning och understrykning. Det hjälper till att dekorera texten. Den anger helt enkelt hur över- och understrukna ritas när de passerar över stigande och nedstigande.
#decoration {text-decoration-skip: ink}Värden som kan användas med text-dekorationshopp är:
frågor om försäljningsstyrka molnintervju
objekt : (standard) raden hoppar över inbyggda objekt, som bilder eller inbyggda blockelement.
ingen : linjen korsar allt.
mellanslag : dekorationslinjen hoppar över mellanslag, ordavskiljartecken och alla mellanslag som anges med bokstavsavstånd eller ordavstånd.
skillnaden mellan final slutligen och finalisera
bläck : dekorationslinjen hoppar över tecken, nedstigningar eller stigningar.
kanter : dekorationslinjen börjar något efter innehållets startkant och slutar något före innehållets slutkant.
box-dekoration : dekorationslinjen hoppar över ärvda marginaler, kantlinjer och stoppning.
Eftersom den här egenskapen inte stöds av någon webbläsare finns det ingen demo, men här är ett exempel på bilden nedan för hur vart och ett av värdena kan se ut när text-dekoration-hopp har implementerats.
Med detta kommer vi till slutet av denna textdekoration med CSS-blogg. Om du har frågor angående detta ämne, vänligen lämna en kommentar nedan så återkommer vi till dig.
Kolla in vår som kommer med instruktörsledad live-utbildning och verklig projektupplevelse. Denna utbildning gör dig skicklig i färdigheter för att arbeta med back-end och front-end webbteknik. Det inkluderar utbildning om webbutveckling, jQuery, Angular, NodeJS, ExpressJS och MongoDB.
Har du en fråga till oss? Vänligen nämna det i kommentarsektionen på 'Textdekoration med CSS' -bloggen så kommer vi tillbaka till dig.