Wednesday 14 July 2021

How to Create CSS Counter

 CSS COUNTER CREATION STEP BY STEP

EXAMPLE : 

<style>

body {

  counter-reset: section;

  background-color: DodgerBlue;

}

h2{

border:1px solid red;

background-color: tomato;

padding: 15px;

box-shadow: 1px 1px 1px 1px;


}

h2:hover{

background-color: black;

color: white;

}



h2::before {

  counter-increment: section;

  content: " " counter(section) " ";

  color: white;

  border-radius: 50%;

  border-color: black;

  border-style: solid;

  padding-left:08px;

  text-align: center;

  background-color: DodgerBlue;

}

</style>



<h2> Web Design Tutorial</h2>

<h2> HTML Tutorial</h2>

<h2> CSS Tutorial</h2>

<h2> JavaScript Tutorial</h2>

<h2> Bootstrap Tutorial</h2>

<h2> Lean All Programming and Scripting Languages with Youtube.com/avadhtutor</h2>

<h2>Please Like Share and Subscribe Our Channel </h2>





learn all Programming with youtube.com/avadhtutor


No comments:

Post a Comment