Cara Advance Untuk Styling Box

Artikel ini bertindak sebagai sekotak trik, memberikan pengantar beberapa fitur canggih yang tersedia untuk box styling yaitu Cara Advance Untuk Styling Box.

Yang di maksud dengan advance di sini adlah featur lain yang di berikan CSS untuk mengatur styling box agar box lebih menarik dan bagus.

COntohnya saya akan membuat multiple box shadow :

<article class="multiple">
  <p><strong>Warning</strong>: The thermostat on the cosmic transcender has reached a critical level.</p>
</article>

CSS:

p {
  margin: 0;
}

article {
  max-width: 500px;
  padding: 10px;
  background-color: red;
  background-image: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.25));
}  

.multiple {
  box-shadow: 1px 1px 1px black,
              2px 2px 1px black,
              3px 3px 1px red,
              4px 4px 1px red,
              5px 5px 1px black,
              6px 6px 1px black;
}

Maka akan memiliki hasil seperti ini :

Oke baiklah itu saja dari saya , sampai bertemu pada artikel selanjutnya.