Het onderstrepen van een document of tekst wordt altijd als gemakkelijk beschouwd. Maar als we het geval voor de websites bekijken, is het dan nog gemakkelijk? De meesten van ons zouden ja zeggen, maar het maken van een horizontale lijn inclusief enkele aangepaste ontwerpen maakt deze eenvoudige taak vervelend. Laten we de reis van tekstdecoratie beginnen met CSS op de volgende manier:
- Wat is tekstversiering?
- Soorten tekstdecoraties in CSS
- Tekstversiering met CSS: code
- Tekstversiering overslaan
Wat is tekstversiering?
Het bepaalt het uiterlijk van de decoratieve lijnen op tekst. Het is een afgekorte eigenschap voor:
verschil tussen chef en ansible
- tekst-decoratie-regel
- tekst-decoratie-kleur
- tekst-decoratie-stijl
Het wordt gespecificeerd als een of meer door spaties gescheiden waarden die de lange hand te vertegenwoordigenxt-decoratie-eigenschappen.
Syntaxis:
tekst-decoratie: || ||
Waar,
tekst-decoratie-regel: Het wordt gebruikt om het soort versiering dat wordt gebruikt in te stellen, zoalsonderstrepen, onderstrepen en doorlijnen.
tekst-decoratie-kleur:Het wordt gebruikt om de kleur van de decoratie te bepalen.
text-decoration-style: Het wordt gebruikt om de stijl van de lijn in te stellen, zoalsstevig, golvend, gestippeld, onderbroken, dubbel
Soorten tekstdecoraties in CSS
- Overline:
#decoration {text-decoration: overline} 
- Lijn door:
#decoration {text-decoration: line-through}- Onderstrepen:
#decoratie {text-decoration: underline}- Combinatie:
#decoration {text-decoration: underline line-through overline}Uitgang:
Tekstversiering met CSS: code
Code:
CSS-code:
#overline {text-decoration: wavy overline lime} #underover {text-decoration: dashed underline overline} #dotted {text-decoration: underline overline dotted red} #wavy {text-decoration: line-through wavy}Uitgang:
Tekstversiering overslaan
Een eigenschap die bekend staat als text-decoration-skip kan ook worden gebruikt waar een tekst overline, line-through en onderstrepen. Het helpt bij het versieren van de tekst. Het specificeert eenvoudig hoe bovenlijn en onderstreping worden getekend wanneer ze over stijg- en daalplanken gaan.
#decoration {text-decoration-skip: ink}Waarden die kunnen worden gebruikt met het overslaan van tekstversieringen zijn:
voorwerpen : (standaard) lijn slaat inline-objecten over, zoals afbeeldingen of inline-blokelementen.
geen : lijn kruist alles.
spaties : de decoratieregel slaat spaties, woordscheidingstekens en alle spaties met letterafstand of woordspaties over.
inkt : decoratielijn slaat symbolen, afstammelingen of stijgers over.
randen : decoratieregel begint iets na de beginrand van de inhoud en eindigt iets voor de eindrand van de inhoud.
doos-decoratie : decoratielijn springt over de geërfde marge, rand en opvulling.
Aangezien deze eigenschap door geen enkele browser wordt ondersteund, is er nog geen demo, maar hier is een voorbeeld in de onderstaande afbeelding van hoe elk van de waarden eruit zou kunnen zien als text-decoration-skip is geïmplementeerd.
Hiermee komen we aan het einde van deze Text Decoration Using CSS-blog. Als je vragen hebt over dit onderwerp, laat dan hieronder een reactie achter en we nemen zo snel mogelijk contact met je op.
Bekijk onze die wordt geleverd met live training onder leiding van een instructeur en real-life projectervaring. Deze training maakt je bedreven in vaardigheden om met back-end en front-end webtechnologieën te werken. Het omvat training over webontwikkeling, jQuery, Angular, NodeJS, ExpressJS en MongoDB.
sorteerfunctie in c ++
Heeft u een vraag voor ons? Vermeld het in het commentaargedeelte van de blog 'Tekstversiering met CSS' en we nemen zo snel mogelijk contact met u op.