Atölye › Kartvizitim › 5/12. adım

Kutuyu karta benzet

Ne yapıyoruz

Şimdi card adlı kutuyu karta çeviriyoruz: beyaz zemin, içeride boşluk, yuvarlak köşeler.

Bir sınıfa kural yazmak için seçicinin başına nokta konur: .card = "sınıfı card olan her şey".

```css
.card {
  background: white;
  padding: 24px;
  border-radius: 12px;
}
```

.card { → baştaki nokta "sınıf" demek: kural yalnız class="card" olan kutuya uygulanır.
background: white; → kartın zemini beyaz.
padding: 24px; → iç boşluk: kartın kenarı ile içindeki yazı arasında 24 piksel boşluk. Yazılar kenara yapışmasın.
border-radius: 12px; → köşeleri 12 piksel yuvarlat. 0 sivri köşe, büyüdükçe daha yuvarlak.

body kuralının kapanan } işaretinin altına bir boş satır bırak ve .card kuralını yaz (yine <style> içinde). Çalıştır.

Beceriler: CSS ile görünüm