हेल्लो दोस्तों! आपको CSS के बारे में बहुत सी जानकारी दिया जा चूका है जिसमे CSS क्या होता है कैसे काम करता है आज इस पोस्ट में CSS box-shadow property in Hindiके बारे में दिया गया है तो चलिए शुरू करते है
Contents
Introduction to CSS box-shadow property
CSS box मॉडल को design करने के लिए आप अलग से colors और shapes की border background margin और padding का प्रयोग किया जाता है इनके अलावा CSS(CSS box-shadow property in Hindi) में एक और property available है जिसके द्वारा आप किसी box की shadow भी create कर सकते है
box की shadow create करने के लिए box-shadow property का प्रयोग किया जाता है किसी भी box की shadow create करके आप attractive effect create कर सकते है आप box की किसी भी width की shadow create कर सकते है
syntax of CSS box-shadow property
इस property का syntax(CSS box-shadow property in Hindi) निचे दिया जा रहा है
box-shadow:horizontal | shadow vertical | shadow blur width color;जैसा की आप उपर दी गयी 5 value को देख सकते है जो syntax में define किया गया है इन सभी के बारे में निचे details से दिया गया है
horizontal | shadow
इस value के द्वारा आप define करते है की shadow left में होगी या right में जब यह value positive में होती है तो shadow right में show होगी और जब यह value negative में होती है तो shadow left में show होती है इस प्रकार इसकी value increase या decrease होने से shadow left में या right में बदती जाती है यह value को pixel में देते है
vertical | shadow
इस value के द्वारा shadow top में होगा या shadow bottom में होगा ये define किया जाता है तथा यदि value negative हो तो वह top में होगा तथा यदि value positive हो तो shadow bottom में show होगा तथा value भी pixel में दी जाती है
blur
इस value के द्वारा आप को कितनी sharp या धुधली देखना चाहते है आप इस value के द्वारा define कर सकते है जब आप इस value को 0 या negative define करते है तो shadow किसी border की तरह sharpe दिखाई देती है
width
इस value के द्वारा आप shadow की width define कर सकते है
color
इस value के द्वारा आप shadow का color को define कर सकते है
इस सभी को हम एक example से समझ सकते है
<html>
<head>
<title>css box shadow</title>
<style>
h2{
box-shadow:5px 5px 5px 5px blue;
width:200px;
margin:20px;
}
</style>
</head>
<body>
<h2>css-box shadow property example here</h2>
</body>
</html>
reference-https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow
निवेदन:-आप सभी छात्र –छात्रों से निवेदन है की अगर आपको ये Topic अच्छा लगा हो तो कृपया आप इस वेबसाइट के बारे में अपने दोस्तों को जरुर बताये अगर कोई topic से संबधित प्रश्न हो तो कमेंट्स(comments) आपके लिए ही बना है और किसी Subject के लेकर भी कोई प्रश्न हो तो कमेंट करे
“आपका comments हमारे लिए बहुमूल्य है “ *_*धन्यवाद