Posts

How to create a zebra stripped table with Html CSS

Image
  Source Code: <! DOCTYPE html > < html > < head > < style >     table {         border-collapse : collapse ;         width : 100% ;     }     th , td {         padding : 0.2rem ;         text-align : right ;         border : 3px solid #ccc ;     }     tbody tr:nth-child (odd){         background : rgb ( 173 , 168 , 168 );     } </ style > </ head > < body >     < h1 > Zebra Tables </ h1 >     < table class = "ZEBRA" >         < thead >             < tr >                 < th > Date </ th >                 < th > Sales </ th >         ...

Star Rating Design Using Html Css - Source Code

Image
  Source Code: <! DOCTYPE html > < html lang = "en-us" > < style > body {     display : flex ;     justify-content : center ;     align-items : center ;     width : 100vw ;     height : 100vh ;     margin : 0 ;     padding : 0 ;     font-family : "Poppins" ;     background : linear-gradient ( rgb ( 255 , 39 , 39 ), rgb ( 70 , 70 , 255 )); } fieldset {     display : flex ;     justify-content : space-around ;     align-items : center ;     border-style : solid ;     border-color : black ;     border-width : 10px 25px ;     border-radius : 20px ;     position : relative ;     font-size : 2rem ;     padding : 0 ;     margin : 0 ;     width : 100px ;     height : 50px ;     background : black ; } fieldset::before , fieldset::after { ...