Hvordan tegne et hake/hake ved hjelp av CSS

' beholderelement med en ' id ' eller en ' klasse ':

< div id = 'hake' >< / div >

I HTML-setningen ovenfor, en ' div '-elementet er lagt til med ID-en erklært som ' hake '.

Mens du styler elementet ved å bruke CSS-egenskapene, legg til en ' id ”-velger for å referere til HTML-elementet og deretter spesifisere egenskaper inne i det:

---

---

#hake
{
transformere: rotere ( 45 grader ) ;
høyde : 45px;
bredde : 20px;
marg-venstre: femti %;
border-bottom: 9px solid mørkeolivegrønn;
border-right: 9px solid mørkolivegrønn;
}

CSS-stilelementet ovenfor har følgende egenskaper:

• « transformere: rotere (45 grader) ” roterer de rette vertikale og horisontale linjene på en slik måte at formen blir til et hakesymbol.
• « høyde ' egenskapen setter høyden på hakesymbolet til ' 45 piksler '.
• « bredde ' egenskap gjør symbolet ' 20 piksler ' bred.
• « marg-venstre ”-egenskapen justerer hakesymbolet til midten av nettsidegrensesnittet.
• Etter det, ' grense-bunn ' og ' grense-høyre ' egenskaper setter kantvekten til begge linjene til ' 9px ' og definer ' mørkeolivegrønn ” farge for begge linjene som utgjør et komplett hakesymbol.

Dette vil lage en grønnfarget enkel hake eller hakesymbol som vises i midten av nettsidegrensesnittet ' 45 piksler 'høy og' 20 piksler ' bred:

Metode 2: Sette inn et hake/hake ved hjelp av Unicode-tegn

Det er også noen Unicode-tegn som automatisk setter inn hakesymbolene i utdataene uten å måtte style og definere parameterverdier for dem. For eksempel Unicode-tegnet ' U+2713 ” hjelper til med å legge til et enkelt hakesymbol i utdataene. På samme måte er Unicode-tegnet ' U+2713 ” hjelper til med å sette inn det hvite tunge hakesymbolet i utdataene. For å lære hvordan du legger til disse Unicode-tegnene i et HTML-dokument gjennom en komplett veiledning, klikk her .

Konklusjon

Et hake eller et hakesymbol kan tegnes ved først å lage et HTML-element med en id eller en klasse og deretter legge til id-en eller klassevelgeren i CSS-stilelementet for å referere til det elementet. For å lage formen til et hakemerke/hake på websidegrensesnittet, kan forskjellige CSS-egenskaper som ' høyde ', ' bredde ', ' rotere ' og ' farge ” kan brukes i henhold til type og størrelse på haken man ønsker. Denne bloggen demonstrerer metoden for å tegne en hake/hake ved hjelp av CSS.