Bagaimana untuk Mencipta Tindanan Sempadan untuk Div ​​Kanak-kanak dengan Elemen Pseudo?

Mencipta Div Anak Tindanan Sempadan

Untuk mencipta kesan tindanan jidar untuk div kanak-kanak, anda boleh mempertimbangkan untuk menggunakan unsur pseudo. Pendekatan ini menawarkan beberapa kelebihan:

• Mengelakkan keperluan untuk penandaan tambahan.
• Meningkatkan kawalan ke atas kedudukan dan saiz sempadan.

Contoh Pelaksanaan :

body {
  background: grey;
}

.button {
  background: #94c120;
  width: 200px;
  height: 50px;
  margin: 50px;
  position: relative;
}

.button:before {
  content: "";
  position: absolute;
  top: -15px;
  left: -15px;
  width: 100%;
  height: 100%;
  border: 5px solid #fff;
  box-sizing: border-box;
}

<div class="button">
  some text
</div>

Atas ialah kandungan terperinci Bagaimana untuk Mencipta Tindanan Sempadan untuk Div ​​Kanak-kanak dengan Elemen Pseudo?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!