CSS

Cara Membuat Bintang Di Css



Pada artikel ini saya akan membuat bintang di css. Simak saja langsung di bawah!

Bintang Di Css

Pada artikel sebelumnya saya telah membuat berlian di css kamu bisa lihat di sini. Harap kamu sudah tahu teknologi web seperti html dan css penulisan artikel di sini tidak terlalu panjang. Nah langsung saja kamu buat file html nya dengan nama index.html

<!doctype html>
   <html>
  <head>
    <title>Bintang Di Css</title>
      <link rel="stylesheet" type="text/css" href="style.css"> 
  </head>   
    
  <body>         
      <center><div class="bintang"></div></center>
      
  </body>
</html>

Lalu kamu buat file css nya dengan nama style.css

body{
    background-color: darkblue;
}

.bintang{
   position: relative;
   height: 0;
   width: 0;
   border-bottom: 100px solid #FFFF;
   border-left: 50px solid transparent;
   border-right: 50px solid transparent;
}

.bintang::after{
    position: absolute;
    border-top:100px solid #FFFF;
    border-left:50px solid transparent;
    border-right:50px solid transparent;
    content:"";
    top:30px;
    left:-50px;
   
}

Penutup

Nah kode di atas jangan lupa di save hasil tersebut bisa di lihat di sini. Semoga bermanfaat :D