Een vinkje/vinkje tekenen met behulp van CSS

” containerelement met een “ ID kaart ” of een “ klas ”:

< div ID kaart = 'vinkje' >< / div >

In de bovenstaande HTML-verklaring is een ' div ” element is toegevoegd met de id gedeclareerd als “ vinkje ”.

Voeg tijdens het stylen van het element met behulp van de CSS-eigenschappen een ' ID kaart ” selector om naar het HTML-element te verwijzen en vervolgens de eigenschappen daarin op te geven:

---

---

#vinkje
{
transformeren: roteren ( 45 gr ) ;
hoogte : 45px;
breedte : 20px;
marge-links: vijftig %;
border-bottom: 9px effen donkerolijfgroen;
border-right: 9px effen donkerolijfgroen;
}

Het bovenstaande CSS-stijlelement heeft de volgende eigenschappen:

• De ' transformeren: roteren (45 graden) ” roteert de rechte verticale en horizontale lijnen zodanig dat de vorm van een vinkje ontstaat.
• De ' hoogte ” eigenschap stelt de hoogte van het vinkje in op “ 45px ”.
• De ' breedte ” eigenschap maakt het symbool “ 20px ' breed.
• De ' marge-links ” eigenschap lijnt het vinkje uit op het midden van de webpagina-interface.
• Daarna is de “ grens-bodem ' En ' grens-rechts ” eigenschappen stellen het grensgewicht van beide regels in op “ 9px ” en definieer de “ donkerolijfgroen ” kleur voor beide lijnen die een compleet vinkje vormen.

Hierdoor wordt een groen gekleurd eenvoudig vinkje of vinkje weergegeven in het midden van de webpagina-interface ' 45px ” hoog en “ 20px ' breed:

Methode 2: een vinkje/vinkje invoegen met Unicode-tekens

Er zijn ook enkele Unicode-tekens die automatisch de maatstreepjessymbolen in de uitvoer invoegen zonder dat daarvoor parameterwaarden hoeven te worden gestyled en gedefinieerd. Bijvoorbeeld het Unicode-teken ' U+2713 ” helpt bij het toevoegen van een eenvoudig vinkje in de uitvoer. Evenzo is het Unicode-teken ' U+2713 ” helpt bij het invoegen van het witte zware vinkje in de uitvoer. Om te leren hoe u deze Unicode-tekens in een HTML-document kunt toevoegen via een complete gids, klikt u op hier .

Conclusie

Een vinkje of een vinkje kan worden getekend door eerst een HTML-element met een id of een klasse te maken en vervolgens de id- of klassenkiezer in het CSS-stijlelement toe te voegen om naar dat element te verwijzen. Om de vorm van een vinkje/vinkje op de webpagina-interface te creëren, zijn verschillende CSS-eigenschappen zoals ' hoogte ”, “ breedte ”, “ draaien ' En ' kleur ” kan worden gebruikt afhankelijk van het type en de grootte van het gewenste vinkje. Deze blog demonstreert de methode voor het tekenen van een vinkje/vinkje met behulp van CSS.