v2.5.2
Giriş yap

İki katlı CSS kutuları

brbross
582 defa görüntülendi
2

Merhaba sevgili kullanıcılar, kafa yordum ancak şöyle bir tasarımı nasıl çıkarabileceğimi bulamadım.
Bi' el atabilir misiniz?
Link:https://www.uidesigndaily.com/posts/sketch-profile-card-gradient-day-1377

css
Cevap yaz
Cevaplar (2)
fatihozpolat
1380 gün önce

Örnek olarak bir çalışma yaptım istersen ordan kontrol edebilirsin.

Code Pen Linki

2
#005649
nurullahkilic
1382 gün önce

opacity'si .5 olan bir kutunun before'unun biraz sağında ve aşağısında aynı kutudan oluştururak yapılabilir.

body {
  background:blue;
}
div {
  height: 300px;
  width: 450px;
  border-radius:26px;
  background-color:rgba(255,255,255,.5);
  border:0.2px solid white;
  position:relative;
}

div::before {
  content:"";
  top:13px;
  left:13px;
  position: absolute;
    height: 300px;
  width: 420px;
  border-radius:26px;
  background-color:rgba(255,255,255,.5);
}

hızlıca bir örnek yaptım ama detaylandırılabilir

0
#005618