हिरो वर्ग संशोधन वेब विकासक - 22/03/2026 08:17 EDT

<section class="hero">
<div class="hero-content">
<h1>मेरो वेबसाइटमा स्वागत छ</h1>
<p>यहाँ तपाईँलाई जानकारी, सेवा र मनोरञ्जनको उत्कृष्ट मिश्रण भेटिन्छ।</p>
</div>
</section>
/* पुरानो ब्याकग्राउन्ड हटाउनुहोस् */
/* hero वर्गको नयाँ ब्याकग्राउन्ड लागू गर्नुहोस् */
.hero {
background-image: url('images/your-winner-photo.webp'); /* विजेता फोटो राख्नुहोस् */
background-size: cover;
background-position: center;
background-repeat: no-repeat;
height: 100vh; /* स्क्रिनको पूरा उचाइ */
display: flex;
justify-content: center;
align-items: center;
position: relative;
}

/* टेक्स्ट पढ्न योग्य बनाउन हल्का ओभरले थप्ने */
.hero::before {
content: "";
position: absolute;
top:0;
left:0;
width:100%;
height:100%;
background: rgba(0,0,0,0.3); /* आवश्यक भए opacity बढाउन सकिन्छ */
z-index:1;
}

.hero-content {
position: relative;
z-index:2;
color: #ffffff; /* टेक्स्ट रंग */
text-align: center;
padding: 20px;
}