कोड के टुकड़े 2025, अप्रैल

क्लिक करने योग्य तत्वों को एक सूचक कर्सर दें - सीएसएस-ट्रिक्स

क्लिक करने योग्य तत्वों को एक सूचक कर्सर दें - सीएसएस-ट्रिक्स

A, इनपुट, इनपुट, लेबल, सेलेक्ट, बटन,। पॉइंटर (कर्सर: पॉइंटर;) कुछ तत्व जो क्लिक करने योग्य हैं रहस्यमय तरीके से पॉइंटर कर्सर को ट्रिगर नहीं करते हैं "

फोर्स वर्टिकल स्क्रॉलबार - सीएसएस-ट्रिक्स

फोर्स वर्टिकल स्क्रॉलबार - सीएसएस-ट्रिक्स

Html (ओवरफ्लो-वाई: स्क्रॉल;) यह सीएसएस अमान्य है, लेकिन यह ओपेरा को छोड़कर हर चीज में काम करता है। इसका कारण "सेंटरिंग जंप" को रोकना है जब "

मजबूरन ग्रेस्केल प्रिंटिंग - सीएसएस-ट्रिक्स

मजबूरन ग्रेस्केल प्रिंटिंग - सीएसएस-ट्रिक्स

इस लेखन के समय, यह केवल क्रोम 18+ में काम करेगा, लेकिन यह मानकीकृत है, इसलिए समर्थन अंततः हर जगह आ जाएगा। @मीडिया प्रिंट (शरीर)

फोर्स वेबकीट की फाइल अपलोड इनपुट बटन को दाईं ओर - सीएसएस-ट्रिक्स

फोर्स वेबकीट की फाइल अपलोड इनपुट बटन को दाईं ओर - सीएसएस-ट्रिक्स

फ़ायरफ़ॉक्स और IE में फ़ाइलपथ के दाईं ओर "फ़ाइल चुनें" बटन है, जबकि WebKit इसे बाईं ओर रखता है। इससे WebKit इसे दाईं ओर रखता है "

फ़ॉन्ट ढेर - सीएसएस-ट्रिक्स

फ़ॉन्ट ढेर - सीएसएस-ट्रिक्स

* टाइम्स न्यू रोमन-आधारित स्टैक * / फ़ॉन्ट-परिवार: कंब्रिया, "होफ्लर टेक्स्ट", यूटोपिया, "लिबरेशन सेरिफ़", "निम्बस रोमन नंबर 9 एल रेगुलर", टाइम्स, "टाइम्स न्यू"

फ़ॉन्ट आशुलिपि - सीएसएस-ट्रिक्स

फ़ॉन्ट आशुलिपि - सीएसएस-ट्रिक्स

सिंटेक्स बॉडी (फॉन्ट: फॉन्ट-स्टाइल फॉन्ट-वेरिएंट फॉन्ट-वेट फॉन्ट-साइज / लाइन-हाईट फॉन्ट-फैमिली;) इन बॉडी (फॉन्ट: इटैलिक स्मॉल-कैप नॉर्मल 13px / 150% एरियल, "

IE 6 में फिक्स्ड पोजिशनिंग - सीएसएस-ट्रिक्स

IE 6 में फिक्स्ड पोजिशनिंग - सीएसएस-ट्रिक्स

* (मार्जिन: 0; गद्दी: 0;) html, शरीर (ऊंचाई: 100%;) शरीर #fixedElement (स्थिति: निश्चित! महत्वपूर्ण; स्थिति: पूर्ण; / * यानी 6 और ऊपर * / शीर्ष: 0; "

फिक्स्ड फुटर - सीएसएस-ट्रिक्स

फिक्स्ड फुटर - सीएसएस-ट्रिक्स

#footer (स्थिति: निश्चित; बायां: 0px; निचला: 0px; ऊंचाई: 30px; चौड़ाई: 100%; पृष्ठभूमि: # 999;) / * IE 6 * / * html #footer (स्थिति: निरपेक्ष; "

Flexbox के लिए एक पूर्ण गाइड - सीएसएस-ट्रिक्स

Flexbox के लिए एक पूर्ण गाइड - सीएसएस-ट्रिक्स

सीएसएस flexbox लेआउट के लिए हमारे व्यापक गाइड। यह पूरा गाइड फ्लेक्सबॉक्स के बारे में सब कुछ बताता है, मूल तत्व (फ्लेक्स कंटेनर) और बाल तत्वों (फ्लेक्स आइटम) के लिए सभी विभिन्न संभावित गुणों पर ध्यान केंद्रित करता है। इसमें इतिहास, डेमो, पैटर्न और एक ब्राउज़र समर्थन चार्ट भी शामिल है। "

फैंसी Ampersand - सीएसएस-ट्रिक्स

फैंसी Ampersand - सीएसएस-ट्रिक्स

डैन सेडरहोम ने लंबे समय से बस्करविले इटैलिक एम्परसेंड का इस्तेमाल किया है, और हमें द बेस्ट एम्पर्सैंड उपलब्ध (यहां भी) का उपयोग करने के लिए कहता है। बेहतर या बदतर के लिए, यह "

एक छवि पलटें - सीएसएस-ट्रिक्स

एक छवि पलटें - सीएसएस-ट्रिक्स

आप सीएसएस के साथ छवियों को फ्लिप कर सकते हैं! संभव परिदृश्य: एक "तीर" के लिए केवल एक ग्राफिक होना, लेकिन अलग-अलग दिशाओं में इंगित करने के लिए इसे चारों ओर फ़्लिप करना।

बक्से का विस्तार नेविगेशन - सीएसएस-ट्रिक्स

बक्से का विस्तार नेविगेशन - सीएसएस-ट्रिक्स

CSS-ट्रिक्स के v8 डिज़ाइन से। डेमो नेवी देखें (बैकग्राउंड: # 444; बॉर्डर-बॉटम: 8px सॉलिड # E6E2DF; ओवरफ्लो: छिपा हुआ; पोजीशन: रिलेटिव; चौड़ाई: 100%;) "

ड्रॉप कैप्स - सीएसएस-ट्रिक्स

ड्रॉप कैप्स - सीएसएस-ट्रिक्स

एक्सेस करने योग्य तरीका आपका सबसे अच्छा शर्त है कि आप एथन का 5 मिनट का वीडियो देखें और फिर इसे देखें: CodePen एम्बेड फ़ॉलबैक क्रॉस-ब्राउज़र तरीका (अतिरिक्त मार्कअप) "

सटीक रूप से केंद्र एक छवि / Div क्षैतिज और लंबवत - सीएसएस-ट्रिक्स

सटीक रूप से केंद्र एक छवि / Div क्षैतिज और लंबवत - सीएसएस-ट्रिक्स

.center (चौड़ाई: 300px; ऊँचाई: 300px; स्थिति: निरपेक्ष; बायाँ: 50%; शीर्ष: 50 अंक; मार्जिन-बाएँ: -150px; मार्जिन-टॉप: -150px;) नकारात्मक मार्जिन ठीक है "

आइवी लीफ के साथ अंत लेख - सीएसएस-ट्रिक्स

आइवी लीफ के साथ अंत लेख - सीएसएस-ट्रिक्स

P: अंतिम संतान: के बाद (सामग्री: "2766"; / * यहां आइवी लीफ आती है * / फ़ॉन्ट-आकार: 150%; / * पत्ती को सामान्य पाठ से बड़ा बनाता है * / गद्दी-छोड़ दिया: 10px; "

विकर्ण ग्राफ पेपर ग्रेडिएंट - सीएसएस-ट्रिक्स

विकर्ण ग्राफ पेपर ग्रेडिएंट - सीएसएस-ट्रिक्स

# उदाहरण-ढाल (ऊंचाई: 200px; मार्जिन: 0 0 20px 0; पृष्ठभूमि-रंग: #eaeakin; पृष्ठभूमि-आकार: 20px 20px; पृष्ठभूमि-छवि: "

CSS त्रिभुज - सीएसएस-ट्रिक्स

CSS त्रिभुज - सीएसएस-ट्रिक्स

HTML आप उन्हें एक ही div के साथ बना सकते हैं। प्रत्येक दिशा की संभावना के लिए कक्षाएं लगाना अच्छा है। CSS विचार शून्य चौड़ाई और ऊंचाई वाला एक बॉक्स है। "

कस्टम फ़ाइल इनपुट स्टाइलिंग - सीएसएस-ट्रिक्स

कस्टम फ़ाइल इनपुट स्टाइलिंग - सीएसएस-ट्रिक्स

यदि आप वेबकिट / ब्लिंक / क्रोम विशिष्ट स्टाइल में रुचि रखते हैं, तो छिपाने के लिए एक मालिकाना छद्म तत्व है, और फिर एक गैर-मानक का उपयोग करें "

सीएसएस बॉक्स छाया - सीएसएस-ट्रिक्स

सीएसएस बॉक्स छाया - सीएसएस-ट्रिक्स

ब्लॉक-स्तरीय तत्वों (जैसे डिव) से छायांकन में उपयोग किया जाता है। .shadow (-moz-box-shadow: 3px 3px 5px 6px #ccc; -webkit-box-shadow: 3px 3px 5px 6px #ccc; "

कस्टम रेडियो बटन - सीएसएस-ट्रिक्स

कस्टम रेडियो बटन - सीएसएस-ट्रिक्स

#foo: चेक किया गया :: पहले, इनपुट (स्थिति: निरपेक्ष; क्लिप: रेक्ट (0,0,0,0); क्लिप: रेक्ट (0 0 0 0);) #foo: चेक किया गया, इनपुट + लेबल :: से पहले) सामग्री:"

सीएसएस दोहराता ग्रेडर - सीएसएस-ट्रिक्स

सीएसएस दोहराता ग्रेडर - सीएसएस-ट्रिक्स

दोहराए जाने वाले ग्रेडिएंट एक चाल लेते हैं जो हम पहले से ही रैखिक-ढाल () और रेडियल-ग्रेडिएंट () अंकन, और "पर रंग-स्टॉप के रचनात्मक उपयोग के साथ कर सकते हैं"

कस्टम चेकबॉक्स और रेडियो बटन - सीएसएस-ट्रिक्स

कस्टम चेकबॉक्स और रेडियो बटन - सीएसएस-ट्रिक्स

यहां चयनकर्ता वुफू मार्कअप के लिए विशिष्ट हैं, लेकिन काम पर अवधारणाएं किसी भी रूप में काम कर सकती हैं। समग्र विचार यह है कि आप डिफ़ॉल्ट रेडियो बनाते हैं "

CSS पाठ छाया - सीएसएस-ट्रिक्स

CSS पाठ छाया - सीएसएस-ट्रिक्स

नियमित पाठ छाया: p (पाठ-छाया: 1px 1px 1px # 000;) एकाधिक छाया: p (पाठ-छाया: 1px 1px 1px # 000, 3px 3px 5px नीला;) पहले दो मान "

सीएसएस ग्रिड स्टार्टर लेआउट - सीएसएस-ट्रिक्स

सीएसएस ग्रिड स्टार्टर लेआउट - सीएसएस-ट्रिक्स

यह CSS ग्रिड का उपयोग करके लेआउट और पैटर्न के लिए स्टार्टर टेम्पलेट्स का एक संग्रह है। यहाँ विचार यह दिखाने के लिए है कि तकनीक क्या करने में सक्षम है और "

सीएसएस भाड़े लक्ष्यीकरण फ़ायरफ़ॉक्स - सीएसएस-ट्रिक्स

सीएसएस भाड़े लक्ष्यीकरण फ़ायरफ़ॉक्स - सीएसएस-ट्रिक्स

फ़ायरफ़ॉक्स 2 html> / ** / बॉडी .selector, x: -moz-any-link (color: lSO); फ़ायरफ़ॉक्स 3 html> / ** / body .selector, x: -moz-any-link, x: default (रंग: चूना;) कोई भी "

CSS केवल इमेज प्रीलोडिंग - सीएसएस-ट्रिक्स

CSS केवल इमेज प्रीलोडिंग - सीएसएस-ट्रिक्स

इमेज प्रीलोडिंग का उपयोग करने का एक बड़ा कारण यह है कि यदि आप किसी माउसओवर या: होवर ईवेंट पर किसी तत्व की पृष्ठभूमि-छवि के लिए किसी छवि का उपयोग करना चाहते हैं। यदि आप केवल "

सीएसएस डायग्नोस्टिक्स - सीएसएस-ट्रिक्स

सीएसएस डायग्नोस्टिक्स - सीएसएस-ट्रिक्स

HTML में गलतियाँ खोजें और उनमें से बकवास को उजागर करें। / * खाली तत्व * / div: खाली, अवधि: खाली, ली: खाली, p: खाली, td: खाली, th: खाली (गद्दी: "

CSS फ़ॉन्ट परिवार - सीएसएस-ट्रिक्स

CSS फ़ॉन्ट परिवार - सीएसएस-ट्रिक्स

संस-सेरिफ़ एरियल, sans-serif; हेल्वेटिका, सैंस-सेरिफ़; गिल संस, सेन्स-सेरिफ़; ल्यूसिडा, सैंस-सेरिफ़; हेल्वेटिका नैरो, सैंस-सेरिफ़; सान्स सेरिफ़; सेरिफ़ टाइम्स, "

CSS3 ज़ेबरा पट्टी एक मेज - सीएसएस-ट्रिक्स

CSS3 ज़ेबरा पट्टी एक मेज - सीएसएस-ट्रिक्स

Tbody tr: nth-child (विषम) (पृष्ठभूमि-रंग: #ccc?) "

क्रॉस ब्राउज़र अपारदर्शिता - सीएसएस-ट्रिक्स

क्रॉस ब्राउज़र अपारदर्शिता - सीएसएस-ट्रिक्स

इन दिनों, आपको वास्तव में अस्पष्टता के बारे में चिंता करने की ज़रूरत नहीं है, एक कठिन चीज़ क्रॉस-ब्राउज़र। आप इस तरह से अपारदर्शिता संपत्ति का उपयोग करें:।