Jak nakreslit zaškrtnutí/zaškrtnutí pomocí CSS

'kontejnerový prvek s ' id “ nebo „ třída “:

< div id = 'zaškrtnutí' < / div >

Ve výše uvedeném příkazu HTML je „ div ” prvek byl přidán s id deklarovaným jako “ zaškrtnutí “.

Při stylování prvku pomocí vlastností CSS přidejte „ id ” pro odkazování na element HTML a poté v něm specifikujte vlastnosti:

---

---

#zaškrtnutí
{
přeměnit: otočit ( 45 stupňů ) ;
výška : 45px;
šířka : 20px;
okraj-levý: padesáti %;
border-bottom: 9px solid darkolivegreen;
border-right: 9px solid darkolivegreen;
}

Výše uvedený prvek stylu CSS má následující vlastnosti:

• ' transformace: rotace (45 stupňů) ” otočí rovné svislé a vodorovné čáry takovým způsobem, že vytvoří tvar symbolu zatržítka.
• ' výška Vlastnost ” nastaví výšku symbolu zatržítka na “ 45 pixelů “.
• ' šířka 'vlastnost dělá symbol' 20 pixelů “široký.
• ' okraj-levý Vlastnost ” zarovná symbol zatržítka na střed rozhraní webové stránky.
• Poté se „ hranice-dole ' a ' hranice vpravo Vlastnosti nastaví tloušťku ohraničení obou čar na hodnotu 9px “ a definujte „ darkolivegreen ” barva pro oba řádky, které tvoří úplný symbol zaškrtnutí.

Tím se vytvoří zeleně zbarvená jednoduchá značka zaškrtnutí nebo symbol zaškrtnutí zobrazený uprostřed rozhraní webové stránky “ 45 pixelů 'vysoké a' 20 pixelů “široký:

Metoda 2: Vložení zaškrtnutí/zaškrtnutí pomocí znaků Unicode

Existují také některé znaky Unicode, které automaticky vkládají symboly značek do výstupu, aniž by pro ně bylo nutné stylizovat a definovat hodnoty parametrů. Například znak Unicode „ U+2713 ” pomáhá přidat jednoduchý symbol zaškrtnutí do výstupu. Podobně znak Unicode „ U+2713 ” pomáhá vložit do výstupu symbol bílého těžkého zaškrtnutí. Chcete-li se dozvědět, jak přidat tyto znaky Unicode do dokumentu HTML prostřednictvím úplného průvodce, klikněte tady .

Závěr

Symbol zaškrtnutí nebo zatržítka lze nakreslit tak, že nejprve vytvoříte prvek HTML s id nebo třídou a poté přidáte id nebo selektor třídy do prvku stylu CSS, aby se na tento prvek odkazovalo. Chcete-li vytvořit tvar zaškrtnutí/zaškrtnutí na rozhraní webové stránky, použijte různé vlastnosti CSS jako „ výška “, “ šířka “, “ točit se ' a ' barva ” lze použít podle typu a velikosti zaškrtnutí, které chcete. Tento blog demonstruje metodu kreslení zaškrtnutí / zaškrtnutí pomocí CSS.