HTML में बैकग्राउंड कैसे हटाएँ: सबसे आसान तरीका
कभी-कभी आपको वेब पेज का बैकग्राउंड सेट करना या किसी विशेष चीज को सुंदरता से या किसी विशिष्ट चीज को हाइलाइट करने के लिए किसी एलिमेंट को एडिट करना हो सकता है।
लेकिन, ऐसा करना HTML का हर किसी के बस की बात नहीं है। इसलिए, यहां आपके लिए एक गाइड है जो बताएगा कैसे आप HTML में आसानी से बैकग्राउंड फोटोज को हटा सकते हैं!
HTML में बैकग्राउंड फोटो को कैसे हटाएँ?
HTML में बैकग्राउंड फोटो को हटाने के लिए निम्नलिखित चरणों का पालन करें:
स्टेप 1: <h2> एलिमेंट और तीन <div> एलिमेंट का उपयोग करके एक HTML बनाएं। और दूसरे <div> के लिए, एक "id" का उपयोग करें जो "no-background" पढ़ता है।
<h2>Example</h2>
<div></div>
<div id="no-background"></div>
<div></div>
स्टेप 2: पहले और आखिरी <div> एलिमेंट्स को स्टाइल जोड़ने के लिए सीएसएस जोड़ें।
अपने <div> की ऊचाई और चौड़ाई जोड़ें और फिर मार्जिन-बॉटम, बॉर्डर गुण और बैकग्राउंड-कलर स्पष्ट करें।
और तब, "url" वैल्यू के साथ बैकग्राउंड-इमेज वैल्यू का उपयोग करें। इसके बाद, बैकग्राउंड-रिपीट को "no-repeat" से निर्धारित करें और बैकग्राउंड-साइज जोड़ने के लिए समाप्त करें।
यहां एक संभावित दिखने का तरीका है:
div {
height: 170px;
width: 300px;
margin-bottom: 20px;
background-color: #CDCDCD;
border: 2px solid #CDCDCD;
background-image: url('https://images.unsplash.com/photo-1507919909716-c8262e491cde?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=500&q=60');
background-repeat: no-repeat;
background-size: 100%;
}
स्टेप 3: आखिरकार, "no-background" नामक "id" के साथ <div> को स्टाइल करें और <div> एलिमेंट का बैकग्राउंड हटाएं और बैकग्राउंड-इमेज वैल्यू को "none" से सेट करें।
<!DOCTYPE html>
<html>
<head>
<title>The title of the document</title>
<style>
div {
height: 170px;
width: 300px;
margin-bottom: 20px;
background-color: #CDCDCD;
border: 2px solid #CDCDCD;
background-image: url('https://images.unsplash.com/photo-1507919909716-c8262e491cde?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=500&q=60');
background-repeat: no-repeat;
background-size: 100%;
}
div#no-background {
background-image: none;
}
</style>
</head>
<body>
<h2>Example</h2>
<div></div>
<div id="no-background"></div>
<div></div>
</body>
</html>
और इसके साथ, आपकी फोटो से बैकग्राउंड सफलतापूर्वक हटा गया है!
Erase.bg के साथ PNG, JPG, JPEG और WebP फोटोज से बैकग्राउंड हटाएं:
Erase.bg एक बुद्धिमान AI बैकग्राउंड रिमूवर और एडिटिंग उपकरण है जो आपकी फोटोज को सुधारने में मदद करता है। Erase.bg के साथ, कोई भी व्यक्ति अपने तकनीकी कौशल के बिना आसानी से फोटो से बैकग्राउंड हटा सकता है। आप Erase.bg का उपयोग PNG, JPG, JPEG और WebP फोटोज से बैकग्राउंड हटाने के लिए कर सकते हैं।
इन प्रारूपों से बैकग्राउंड हटाने के लिए, आपको या तो वेबसाइट के माध्यम से Erase.bg तक पहुँचने की आवश्यकता है या Erase.bg अनुप्रयोग को एप्लिकेशन स्टोर (iOS उपयोगकर्ताओं के लिए) या गूगल प्ले स्टोर (एंड्रॉयड उपयोगकर्ताओं के लिए) से डाउनलोड करना होगा।
आप आसानी से Erase.bg का उपयोग करके WebP, PNG, JPG और JPEG फोटोज से बैकग्राउंड हटा सकते हैं:
स्टेप 1: "फोटो अपलोड करें" लिखा हुआ संवाद बॉक्स पर क्लिक करें, या आप पृष्ठ पर फोटो को ड्रैग और ड्रॉप भी कर सकते हैं।
स्टेप 2: एक संदेश आएगा जो कहेगा, "फोटो अपलोड हो रहा है, कृपया प्रतीक्षा करें..." और इस समय, Erase.bg की आर्टिफिशियल इंटेलिजेंस आपकी पसंदीदा फोटो से बैकग्राउंड हटाने के लिए अपने जादू को करेगी।
स्टेप 3: यदि आप कुछ हटाना चाहते हैं या फोटो को एडिट करना चाहते हैं, तो आपको बैकग्राउंड हटाए गए फोटो के ऊपरी दाएं कोने पर एक एडिट विकल्प दिखेगा।
स्टेप 4: बैकग्राउंड के बिना अपनी डिवाइस में एडिटेड फोटो को डाउनलोड करें।
FAQ
यहां, हमने समुदाय से आमतौर पर पूछे जाने वाले कुछ प्रश्नों को सूचीबद्ध किया है। यदि आपको अपनी आवश्यक जानकारी नहीं मिलती है, तो बेझिझक support@pixelbin.io पर हमसे संपर्क करें।
HTML में बैकग्राउंड रंग जोड़ने के लिए, इन चरणों का पालन करें:
नोट: इस उदाहरण में हम एक टेबल के बैकग्राउंड कलर को बदल रहे हैं।
स्टेप 1: HTML कोड स्कैन करें ताकि आप जान सकें कि आपको कौनसा तत्व संपादित करना है। यदि यह हैडर है, तो <header> खोलने वाले टैग की खोज करें और यदि यह एक डिव है, तो <div> टैग की खोज करें।
स्टेप 2: अब, उपलब्ध रंगों में से एक रंग चुनें। यहां हम #33475b को चुन रहे हैं।
स्टेप 3: इसके बाद, खोलने वाले टैग में एक स्टाइल एट्रिब्यूट जोड़ें। इस प्रकार, यहां आपका एचटीएमएल कोड दिखेगा:
<table style="background-color:#33475b">
<tr>
<th>Name</th>
<th>Job Title</th>
<th>Email address</th>
</tr>
<tr>
<td>Anna Fitzgerald</td>
<td>Staff Writer</td>
<td>example@company.com</td>
</tr>
<tr>
<td>John Smith</td>
<td>Marketing Manager</td>
<td>example2@company.com</td>
</tr>
<tr>
<td>Zendaya Grace</td>
<td>CEO</td>
<td>example2@company.com</td>
</tr>
</table>
HTML में बैकग्राउंड कलर सेट करने के लिए, आपको स्टाइल एट्रिब्यूट का उपयोग करना होगा, जो तत्व का इनलाइन स्टाइल निर्दिष्ट करता है।
स्टाइल एट्रिब्यूट हमेशा HTML <body> टैग के साथ उपयोग किया जाता है, साथ ही CSS प्रॉपर्टी background-color के साथ। इसलिए, यह इसलिए है कि HTML5 <body> टैग bgcolor एट्रिब्यूट का समर्थन नहीं करता है।
इसलिए, यहां आपका कोड कुछ ऐसा दिख सकता है:
<!DOCTYPE html>
<html>
<head></head>
<bodystyle=“background-color:add_color”>
…
</body>
</html>
ट्रांसपेरेंट के लिए HTML कोड FFFFFF या 00FFFFFF है।
इसके अलावा, आप उस CSS प्रॉपर्टी को परिभाषित करने के लिए "ट्रांसपेरेंट " शब्द का उपयोग कर सकते हैं जिसको एक ट्रांसपेरेंट रंग की आवश्यकता नहीं है।
rgba() और hsla() का एक चौथा पैरामीटर (0 से 1 तक की सीमा में) एक रंग के अल्फा चैनल को परिभाषित करने के लिए होता है।
सिर्फ यही नहीं, हेक्साडेसिमल को सामान्य 24-बिट रंग की बजाय एक 32-बिट रंग को परिभाषित करके एक चौथा अल्फा पैरामीटर भी हो सकता है।
और आखिरकर, आप एक तत्व के लिए ट्रांसपेरेंसी के स्तर को चिह्नित करने के लिए 'अस्पष्टता' सीएसएस प्रॉपर्टी (0 से 1 तक की सीमा में) का उपयोग कर सकते हैं।
बैकग्राउंड फोटो के लिए HTML टैग "background-image" है। यह एक CSS प्रॉपर्टी है जो एक HTML तत्व के लिए बैकग्राउंड फोटो सेट करता है।
नहीं, केवल HTML का उपयोग करके आप फोटो से बैकग्राउंड को हटा नहीं सकते। इसे करने के लिए आपको एक फोटो संपादन उपकरण या एक आर्टिफिशियल इंटेलिजेंस बैकग्राउंड रिमूवर का उपयोग करना होगा।
नहीं, CSS केवल स्वतंत्र रूप से फोटो से बैकग्राउंड को हटा नहीं सकता। हालांकि, आप CSS का उपयोग करके बैकग्राउंड फोटो के रूप में उसकी दिखाई गई कोई बदल सकते हैं, जैसे कि उसकी अस्पष्टता को समायोजित करना या एक फिल्टर प्रभाव जोड़ना।
क्यों Erase.bg
Erase.bg विंडोज, मैक, आईओएस और एंड्रॉइड जैसे कई प्लेटफ़ॉर्मों पर उपयोग किया जा सकता है।
Erase.bg के साथ, आप आसानी से अपनी फोटो के पीछे की बैकग्राउंड को निकाल सकते हैं। इसके लिए आप ड्रैग एंड ड्रॉप विशेषता का उपयोग कर सकते हैं या "अपलोड" पर क्लिक करें।
Erase.bg विंडोज, मैक, आईओएस और एंड्रॉइड जैसे कई प्लेटफ़ॉर्मों पर उपयोग किया जा सकता है।
Erase.bg को निजी और पेशेवर उपयोग के लिए उपयोग किया जा सकता है। इसे अपने कोलाज, वेबसाइट परियोजनाओं, उत्पाद फोटोग्राफी आदि के लिए उपयोग करें।
Erase.bg में एक एआई है जो आपकी फोटो को सटीकता से प्रसंस्करण करता है और स्वचालित रूप से बैकग्राउंड का चयन करके उसे हटाता है।
आपको अपनी फोटो को पारदर्शी बनाने के लिए डिजाइनर्स की नियुक्ति करने, ग्रीन स्क्रीन खरीदने और विशेष शूट्स की व्यवस्था करने के लिए अतिरिक्त पैसे और समय खर्च करने की जरूरत नहीं पड़ेगी।