-
CSS के साथ स्टाइलिंग फर्स्ट-लेटर्स ::फर्स्ट-लेटर
CSS हमें ::प्रथम-अक्षर छद्म-तत्व का उपयोग करके किसी तत्व के पहले अक्षर को स्टाइल करने में मदद कर सकता है। ध्यान दें कि विराम चिह्न, डिग्राफ और सामग्री गुण पहले अक्षर को बदल सकते हैं। निम्नलिखित उदाहरण CSS ::प्रथम-अक्षर छद्म-तत्व को दर्शाते हैं। उदाहरण <!DOCTYPE html> <html> <head>
-
CSS के साथ आकर्षक पहली पंक्तियाँ बनाना ::पहली पंक्ति
CSS ::फर्स्ट-लाइन स्यूडो-एलिमेंट हमें किसी एलीमेंट की फर्स्ट लाइन को स्टाइल करने में मदद करता है निम्नलिखित उदाहरण CSS ::प्रथम-पंक्ति छद्म-तत्व को दर्शाते हैं। उदाहरण <!DOCTYPE html> <html> <head> <style> body { text-align: center; background-color:
-
सीएसएस के साथ सहोदर तत्वों का चयन
हम आसन्न सिबलिंग चयनकर्ता (+) का उपयोग करते हैं, यदि हम उस तत्व से मेल खाना चाहते हैं जो पहले चयनकर्ता के तुरंत बाद होता है। यहां, दोनों चयनकर्ता एक ही मूल तत्व के बच्चे हैं। CSS आसन्न सिबलिंग कॉम्बिनेटर का सिंटैक्स इस प्रकार है - चयनकर्ता + चयनकर्ता{ विशेषता:/*value*/} यदि हम दूसरे चयनित तत्व की
-
CSS के साथ चाइल्ड एलिमेंट्स का चयन
CSS चाइल्ड कॉम्बिनेटर का उपयोग मूल तत्व के सभी चाइल्ड तत्वों को चुनने के लिए किया जाता है। CSS चाइल्ड कॉम्बिनेटर का सिंटैक्स इस प्रकार है चयनकर्ता {विशेषता:/*मान*/} CSS वंशज संयोजक का उपयोग मूल तत्व के सभी वंशजों को चुनने के लिए किया जाता है CSS वंशज संयोजक का सिंटैक्स इस प्रकार है चयनकर्ता चयनक
-
सीएसएस:फोकस-सूडो क्लास के भीतर
यदि हम किसी केंद्रित तत्व के पैरेंट को स्टाइल करना चाहते हैं, तो हम CSS का उपयोग करते हैं:फोकस-इन स्यूडो-क्लास। निम्नलिखित उदाहरण सीएसएस को स्पष्ट करते हैं:फोकस-भीतर छद्म वर्ग। उदाहरण फॉर्म { मार्जिन:2%; गद्दी:2%; प्रदर्शन:फ्लेक्स; फ्लेक्स-दिशा:स्तंभ; पृष्ठभूमि:थीस्ल;}इनपुट {मार्जिन:2%;}फ़ॉर्म:फोकस
-
CSS में ऑब्जेक्ट-फिट और ऑब्जेक्ट-पोजिशन के साथ क्रॉप इमेज
CSS ऑब्जेक्ट-फिट और वस्तु-स्थिति संपत्ति हमें छवियों को क्रॉप करने और यह निर्दिष्ट करने में मदद करती है कि यह किसी तत्व में कैसे प्रदर्शित होता है। CSS ऑब्जेक्ट-फिट प्रॉपर्टी का सिंटैक्स इस प्रकार है - Selector { object-fit: /*value*/ object-position:/*value*/ } उदाहरण नि
-
CSS में Data-Attributes (data-*) का उपयोग करना
हम data-* विशेषता का उपयोग करके तत्वों के बारे में अतिरिक्त जानकारी संग्रहीत कर सकते हैं। निम्नलिखित उदाहरण CSS डेटा-* विशेषता को दर्शाते हैं। उदाहरण <!DOCTYPE html> <html> <head> <style> dl { margin: 2%; } p { width: 60%; background-col
-
CSS के साथ स्क्रॉल एंकरिंग को अक्षम करना
वेब ब्राउज़र द्वारा प्रदान की गई डिफ़ॉल्ट स्क्रॉल एंकरिंग को अक्षम करने के लिए, हम अतिप्रवाह एंकर . का उपयोग कर सकते हैं संपत्ति। उदाहरण निम्न उदाहरण अतिप्रवाह-एंकर संपत्ति का एक विचार देता है - <!DOCTYPE html> <html> <head> <style> body { overflow-anchor: none;
-
यह नियंत्रित करना कि क्या माउस और टच को CSS पॉइंटर-इवेंट प्रॉपर्टी के साथ अनुमति है
CSS पॉइंटर-इवेंट प्रॉपर्टी का उपयोग करके हम नियंत्रित कर सकते हैं कि किसी तत्व पर माउस और टच की अनुमति है या नहीं। CSS पॉइंटर-इवेंट प्रॉपर्टी का सिंटैक्स इस प्रकार है - pointer-events: auto|none; ऊपर, स्वतः डिफ़ॉल्ट है। तत्व सूचक घटनाओं पर प्रतिक्रिया करता है, जबकि कोई नहीं: तत्व सूचक घटनाओं पर
-
CSS कैरेट-कलर के साथ कर्सर का रंग बदलें
इंसर्शन कैरेट का रंग बदलने के लिए, CSS कैरेट-कलर प्रॉपर्टी उपयोग किया जाता है। उदाहरण निम्नलिखित उदाहरण CSS कैरेट-रंग गुण को दर्शाते हैं। फॉर्म { पैडिंग:2%; मार्जिन:2%; टेक्स्ट-एलाइन:सेंटर;}फॉर्म:फोकस-इन {बॉक्स-शैडो:0 0 10px rgba(0,0,0,0.6); पृष्ठभूमि-रंग:बेज;}इनपुट {फ़ॉन्ट-आकार:3em; कैरेट-रंग:चार्
-
CSS टैब-आकार की संपत्ति के साथ HTML में टैब आकार सेट करना
CSS टैब-आकार की संपत्ति हमें टैब में उपयोग किए जाने वाले व्हॉट्सएप की मात्रा निर्धारित करने की अनुमति देता है। निम्नलिखित उदाहरण CSS टैब-आकार की संपत्ति को दर्शाते हैं। उदाहरण <!DOCTYPE html> <html> <head> <style> body { display: flex; flex-direction
-
टेक्स्ट-एलाइन और टेक्स्ट-जस्टिफाई सीएसएस प्रॉपर्टीज का उपयोग करके टेक्स्ट को जस्टिफाई कैसे करें?
सीएसएस पाठ्य-औचित्य संपत्ति हमें किसी तत्व के लिए औचित्य प्रकार निर्दिष्ट करने में मदद करती है। टेक्स्ट-एलाइन प्रॉपर्टी एक एलिमेंट में टेक्स्ट के हॉरिजॉन्टल अलाइनमेंट को सेट करती है। उदाहरण निम्नलिखित उदाहरण CSS टेक्स्ट-जस्टिफाई प्रॉपर्टी को दर्शाते हैं। <!DOCTYPE html> <html> <head&
-
सीएसएस हाइफ़न संपत्ति के साथ पाठ में हाइफ़न जोड़ना
CSS हाइफ़न का उपयोग करना संपत्ति, हम निर्दिष्ट कर सकते हैं कि टेक्स्ट में हाइफ़न कैसे जोड़े जाते हैं। उदाहरण निम्नलिखित उदाहरण CSS हाइफ़न गुण को दर्शाते हैं। div {चौड़ाई:20%; सीमा:2px नाली चूना; मार्जिन:10px; पैडिंग:10px; हाइफ़न:कोई नहीं; -वेबकिट-हाइफ़न:कोई नहीं; -एमएस-हाइफ़न:कोई नहीं;}div:अंतिम-प्
-
सीएसएस टेक्स्ट-इंडेंट प्रॉपर्टी के साथ इंडेंट टेक्स्ट
CSS टेक्स्ट-इंडेंट संपत्ति हमें इंडेंटिंग टेक्स्ट में सफेद स्थान की मात्रा निर्दिष्ट करने की अनुमति देती है। उदाहरण निम्नलिखित उदाहरण CSS टेक्स्ट-इंडेंट प्रॉपर्टी को दर्शाते हैं। p { text-indent:15%;} article { background-color:#000000; मार्जिन:2%; इसलिए, बहुत सारे इरोज किशोरों की एक अच्छी घाटी है।
-
CSS अपडेट - टेक्स्ट डेकोरेशन और अंडरलाइन्स को स्टाइल करने के लिए नए गुण
निम्नलिखित पाठ-सजावट गुणों की शुरूआत के साथ, अब हम पाठ को पहले की तुलना में अधिक तरीकों से शैलीबद्ध कर सकते हैं। टेक्स्ट-डेकोरेशन टेक्स्ट-डेकोरेशन-थिकनेस, टेक्स्ट-डेकोरेशन-कलर, टेक्स्ट-डेकोरेशन-लाइन और टेक्स्ट-डेकोरेशन-स्टाइल का शॉर्टहैंड है। टेक्स्ट-डेकोरेशन-स्किप, टेक्स्ट-डेकोरेशन-स्किप-इंक, टेक्स
-
CSS का उपयोग करने वाली वेबसाइटों के लिए एक डार्क / लाइट मोड कैसे बनाएं
किसी पेज के टेक्स्ट-कलर और बैकग्राउंड का रंग बदलकर, हम अपनी वेबसाइट के लिए डार्क/लाइट मोड जोड़ सकते हैं। सिंटैक्स डार्क मोड लागू करने के लिए निम्न सिंटैक्स का उपयोग किया जा सकता है। चयनकर्ता {रंग:सफ़ेद; पृष्ठभूमि-रंग:काला} उदाहरण div { font-size:1.4em; पाठ-संरेखण:केंद्र; } .डार्क {रंग:सफ़ेद; पृष
-
CSS का उपयोग करके मोबाइल ब्राउज़र पर पुल-टू-रिफ्रेश सुविधा को अक्षम करना
हम CSS overscrollbehavior प्रॉपर्टी का उपयोग करके वेबपेज के सीमा क्षेत्र को स्क्रॉल करने के आउटपुट को बदल सकते हैं। इसके माध्यम से, हम ब्राउज़र पर पुल-टू-रिफ्रेश को अक्षम कर सकते हैं। CSS overscroll-behavior गुण का सिंटैक्स इस प्रकार है - Selector { overscroll-behavior: /*value*/ } उदाहरण निम्न
-
2020 में वेब डिज़ाइन के लिए नवीनतम CSS गुण और API
डेवलपर्स को जावास्क्रिप्ट और सीएसएस के मिश्रण के साथ अपनी वेबसाइटों को अनुकूलित करने में मदद करने के लिए, नए सीएसएस गुण विकसित किए गए हैं और अब लोकप्रिय ब्राउज़रों का समर्थन करते हैं। इनमें से कुछ नीचे सूचीबद्ध हैं - फोकस-भीतर इसका उद्देश्य तत्वों के भीतर फोकस-पहुंच-योग्यता को हल करना है स्क्रॉल-स्
-
सीएसएस चयनकर्ता उन तत्वों का चयन करने के लिए जिनके पास निश्चित वर्ग / विशेषता / प्रकार नहीं है
CSS :not() छद्म-वर्ग का उपयोग करके, हम उन तत्वों का चयन करके अपनी शैली को परिष्कृत कर सकते हैं जिनका कोई विशिष्ट मान नहीं है या किसी चयनकर्ता से मेल नहीं खाता है। उदाहरण निम्नलिखित उदाहरण सीएसएस को स्पष्ट करते हैं:छद्म वर्ग नहीं। <!DOCTYPE html> <html> <head> <style> p { &nb
-
CSS में स्क्रॉल पर फिक्स्ड हैडर के साथ HTML टेबल्स
पोस्टियन:स्टिकी और टॉप:0 सेट करके, हम HTML टेबल में स्क्रॉल पर एक फिक्स्ड हेडर बना सकते हैं। उदाहरण निम्नलिखित उदाहरण हमें इस बात का अंदाजा देते हैं कि इसे कैसे लागू किया जाए - <!DOCTYPE html> <html> <head> <style> div { color: white; display: flex;