Cara Advance Untuk Styling Box

Artikel ini bertindak selaku sekotak trik, memberikan pengantar beberapa fitur canggih yang terdapat bagi box styling yaitu Cara Advance Bagi Styling Box.

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

COntohnya saya akan membangun 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;
}

Karenanya akan mempunyai hasil seperti ini :

Oke baiklah itu saja dari saya , hingga bertemu di artikel berikutnya.

Sumber https://kursuswebsite.org