पाठ 17 / 28
बैकग्राउंड, बॉर्डर और शैडो
एलिमेंट को भरें, फ्रेम करें, और पेज से उभारें।
बैकग्राउंड प्रॉपर्टी
background-color एक सपाट रंग, background-image: url(...), background-size: cover बॉक्स को भरने के लिए स्केल करता है, background-position उसे अलाइन करता है।
एक हीरो बैकग्राउंड
cover इमेज को बिना बिगाड़े बॉक्स भरने के लिए क्रॉप करता है।
.hero {
background-image: url("hero.jpg");
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}border-radius और box-shadow
border-radius कोनों को गोल करता है (चौकोर बॉक्स पर 50% एक वृत्त बनाता है)। box-shadow: offsetX offsetY blur spread color एक मुलायम शैडो बनाता है।
उभरा हुआ कार्ड
छोटा blur + कम opacity शैडो को स्वाभाविक दिखाता है।
.card {
border-radius: 12px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}