Understregning af et dokument eller en tekst betragtes altid som let. Men hvis vi overvejer tilfældet for webstederne, er det let endnu? De fleste af os vil sige ja, men at lave en vandret linje inklusive nogle brugerdefinerede designs gør denne enkle opgave trættende. Lad rejsen med tekstdekoration ved hjælp af CSS starte på følgende måde:
- Hvad er tekstdekoration?
- Typer af tekstdekorationer i CSS
- Tekstdekoration ved hjælp af CSS: kode
- Tekstdekoration Spring over
Hvad er tekstdekoration?
Det sætter udseendet af de dekorative linjer på tekst. Det er en stenografisk ejendom til:
- tekst-dekoration-linje
- tekst-dekoration-farve
- tekst-dekoration-stil
Det er specificeret som en eller flere plads-adskilte værdier, der repræsenterer den lange hånd text-dekorationsegenskaber.
Syntaks:
tekst-dekoration: || ||
Hvor,
tekst-dekoration-linje: Det bruges til at indstille den slags dekoration, der bruges somunderstrege, overstrege og gennemføre.
tekst-dekoration-farve:Det bruges til at indstille farven på dekorationen.
tekst-dekoration-stil: Det bruges til at indstille stilen på linjen som f.ekssolid, bølget, prikket, stiplet, dobbelt
ved hjælp af scannerklassen i java
Typer af tekstdekorationer i CSS
- Overline:
#decoration {text-decoration: overline} 
- Line-Through:
#decoration {text-decoration: line-through}- Understrege:
#decoration {text-decoration: underline}- Kombination:
#decoration {tekst-dekoration: understreg linie-gennem overline}Produktion:
Tekstdekoration ved hjælp af CSS: kode
Kode:
CSS-kode:
#overline {tekst-dekoration: bølget overline kalk} # underover {tekst-dekoration: stiplet understreget overline} # stiplet {tekst-dekoration: understreg overline stiplet rødt} # bølget {tekst-dekoration: line-through bølget}Produktion:
Tekstdekoration Spring over
En egenskab kendt som tekst-dekoration-spring kan også bruges, hvor en tekst overline, line-through og understregning. Det hjælper med at dekorere teksten. Det specificerer simpelthen, hvordan overline og understregning tegnes, når de passerer over opstigende og nedstigende.
#decoration {text-decoration-skip: ink}Værdier, der kan bruges med tekst-dekorationsspring er:
genstande : (standard) linie springer over integrerede objekter, som billeder eller inline-blokelementer.
ingen : linje krydser alt.
mellemrum : dekorationslinje springer mellemrum, ordseparatortegn og ethvert mellemrum angivet med mellemrum mellem bogstaver eller ord.
blæk : dekorationslinje springer over tegn, nedstigninger eller opstigninger.
kanter : dekorationslinjen starter lidt efter indholdet startkant og slutter lidt inden indholdet slutter kant.
kasse-dekoration : dekorationslinje springer over arvet margen, kant og polstring.
Da denne egenskab ikke understøttes af nogen browser, er der endnu ingen demo, men her er et eksempel på nedenstående billede af, hvordan hver af værdierne kunne se ud, når tekst-dekorations-spring er implementeret.
Med dette kommer vi til slutningen af denne tekstdekoration ved hjælp af CSS-blog. Hvis du har spørgsmål vedrørende dette emne, bedes du give en kommentar nedenfor, så vender vi tilbage til dig.
Tjek vores som kommer med instruktørstyret live træning og projektoplevelse i det virkelige liv. Denne træning gør dig dygtig i færdigheder til at arbejde med back-end og front-end webteknologier. Det inkluderer træning i webudvikling, jQuery, Angular, NodeJS, ExpressJS og MongoDB.
dyb kopi vs lav kopi java
Har du et spørgsmål til os? Nævn det i kommentarfeltet på 'Tekstdekoration ved hjælp af CSS' -blog, så vender vi tilbage til dig.