Come disegnare un segno di spunta/segno di spunta usando i CSS

” elemento contenitore con “ id ” o un “ classe ”:

< div id = 'segno di spunta' >< / div >

Nell'istruzione HTML precedente, un ' div ” è stato aggiunto l'elemento con l'id dichiarato come “ segno di spunta ”.

Durante lo styling dell'elemento utilizzando le proprietà CSS, aggiungi un ' id ” per fare riferimento all'elemento HTML e quindi specificare le proprietà al suo interno:

---

---

#segno di spunta
{
trasformare: ruotare ( 45 gradi ) ;
altezza : 45px;
larghezza : 20px;
margine sinistro: cinquanta %;
border-bottom: 9px solid darkolivegreen;
border-right: 9px solid darkolivegreen;
}

L'elemento di stile CSS sopra ha le seguenti proprietà:

• IL ' trasformare: ruotare (45 gradi) ” ruota le linee dritte verticali e orizzontali in modo tale da creare la forma di un segno di spunta.
• IL ' altezza La proprietà ” imposta l'altezza del segno di spunta su “ 45px ”.
• IL ' larghezza ” la proprietà fa il simbolo “ 20px ' Largo.
• IL ' margine sinistro ” allinea il simbolo di spunta al centro dell'interfaccia della pagina web.
• Dopodiché il “ bordo inferiore ' E ' confine-destra Le proprietà 'impostano lo spessore del bordo di entrambe le linee su' 9 pixel ” e definire il “ verde oliva scuro ” colore per entrambe le linee che formano un segno di spunta completo.

Questo creerà un semplice segno di spunta o segno di spunta di colore verde visualizzato al centro dell'interfaccia della pagina web ' 45px ” alto e “ 20px ' Largo:

Metodo 2: Inserimento di un segno di spunta/segno di spunta utilizzando caratteri Unicode

Ci sono anche alcuni caratteri Unicode che inseriscono automaticamente i simboli del segno di graduazione nell'output senza bisogno di definire lo stile e definire i valori dei parametri per loro. Ad esempio, il carattere Unicode ' U+2713 ” aiuta ad aggiungere un semplice segno di spunta nell'output. Allo stesso modo, il carattere Unicode ' U+2713 ” aiuta a inserire il segno di spunta pesante bianco nell'output. Per sapere come aggiungere questi caratteri Unicode in un documento HTML attraverso una guida completa, clicca Qui .

Conclusione

È possibile disegnare un segno di spunta o un segno di spunta creando prima un elemento HTML con un id o una classe e quindi aggiungendo l'id o il selettore di classe nell'elemento di stile CSS per fare riferimento a quell'elemento. Per creare la forma di un segno di spunta/segno di spunta sull'interfaccia della pagina Web, diverse proprietà CSS come ' altezza ”, “ larghezza ”, “ ruotare ' E ' colore ” può essere utilizzato in base al tipo e alla dimensione del segno di spunta che si desidera. Questo blog mostra il metodo per disegnare un segno di spunta/segno di spunta utilizzando i CSS.