एचटीएमएल सुपरस्क्रिप्ट। Html कैसे टेक्स्ट अपरकेस सीएसएस बनाने के लिए है। बड़े अक्षरों में हाइलाइटिंग

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

नियुक्ति

"टेक्स्ट-ट्रांसफॉर्म" संपत्ति तीन मुख्य मान और दो अतिरिक्त ले सकती है। उदाहरण के लिए, आप सभी चयनित पाठ के लिए एक ऊपरी मामला असाइन कर सकते हैं। या आप पिछली संपत्ति के विपरीत एक कमांड दे सकते हैं, जहां सभी वर्ण निचले हो जाते हैं। आप अपने लिए सुविधाजनक किसी भी विधि का उपयोग करके एक नियुक्ति कर सकते हैं। उदाहरण के लिए, इनलाइन शैलियों का उपयोग करना। या आप बना सकते हैं

सभी संपत्तियों के विवरण के साथ एक अलग फाइल। उपयोग करने के लिए असाइनमेंट का कौन सा तरीका आपके ऊपर है। "पाठ-परिवर्तन" निम्नलिखित मान ले सकता है:

  • अपरकेस। सभी चयनित वर्णों को बड़ा करता है। CSS में, अपरकेस सामान्य है, क्योंकि यह मान कई जटिल पाठ-संबंधित समस्याओं को हल करने में मदद कर सकता है।
  • छोटे। यह संपत्ति पूरी तरह से अपरकेस कमांड के विपरीत है।
  • कैपिटल में लिखें। पहले अक्षर के मामले को अपरकेस में बदल देता है। बाकी पात्रों को नहीं बदला जाएगा।
  • कोई नहीं। आपको सभी निर्दिष्ट मूल्यों को रद्द करने की अनुमति देता है (एक संपत्ति को पूर्वनिर्धारित करने की आवश्यकता है)। आमतौर पर, यह मान डिफ़ॉल्ट रूप से सेट होता है।
  • इनहेरिट। मूल तत्व से सभी गुण इनहेरिट करता है। यह ध्यान दिया जाना चाहिए कि IE इस संपत्ति का समर्थन नहीं करता है।

आवेदन

CSS के साथ, अपरकेस (या समान प्रभाव) एक साधारण कमांड के साथ सेट किए जाते हैं। इसलिए, पूरे पाठ को बदलने या फिर से लिखने की आवश्यकता नहीं है। यदि हम एक-पृष्ठ साइट के बारे में बात कर रहे हैं, तो यह संपत्ति उपयोगी नहीं हो सकती है। लेकिन जब आपके नियंत्रण में एक विशाल पोर्टल होता है, जहां आपको कुछ अंशों में अक्षरों के मामले को सही करने की आवश्यकता होती है, तो "पाठ-परिवर्तन" एकमात्र प्रभावी उपकरण बन जाता है। उदाहरण के लिए, आपको "h2" शीर्षक टैग में फ़ॉन्ट को ठीक करने की आवश्यकता है। ऐसा करने के लिए, प्रविष्टि जोड़ें: "h2 (पाठ-परिवर्तन: अपरकेस;)", और फिर दूसरे स्तर के सभी शीर्षक अपरकेस होंगे।

विशेषताएं:

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

इससे कोई फर्क नहीं पड़ता कि आप किसका उपयोग करना चाहते हैं - निचला या ऊपरी मामला, मुख्य बात उद्देश्य को नहीं भूलना है। उदाहरण के लिए, यदि आपको केवल सजावटी उद्देश्यों के लिए परिवर्तनों की आवश्यकता है, तो आप "पाठ-परिवर्तन" संपत्ति का सुरक्षित रूप से उपयोग कर सकते हैं। ठीक है, यदि आप जानते हैं कि आपके उपयोगकर्ता संभवतः आपके द्वारा पोस्ट की गई जानकारी की नकल करेंगे, तो सभी पाठ के मामले को मैन्युअल रूप से बदलना सबसे अच्छा है। दरअसल, कभी-कभी पाठक इस तरह के एक फ़ॉन्ट परिवर्तन को नोटिस नहीं करते हैं। यह विशेष रूप से महत्वपूर्ण है जब यह महत्वपूर्ण दस्तावेजों और इसी तरह की जानकारी की बात आती है।

कई पाठों के लिए, अब हम CSS का उपयोग करके पाठ को प्रारूपित करने के साथ काम में कठिन हैं, और इस बार हम सीख रहे हैं कि पाठ के मामले को कैसे बदलना है। इस संबंध में, कैस्केडिंग स्टाइल शीट हमारे लिए बहुत व्यापक संभावनाएं खोलती हैं, या अधिक सटीक रूप से, हम कर सकते हैं:

  • बड़े अक्षरों में सभी पाठ प्रदर्शित करें;
  • निचले अक्षरों में सभी पाठ का चयन करें;
  • प्रत्येक शब्द का पहला अक्षर अपरकेस से शुरू करें।

"यह सब अच्छा है, ज़ाहिर है, लेकिन आपको इसकी आवश्यकता कब हो सकती है?" - तुम पूछो। ऐसी स्थिति की कल्पना करें जहां आप सभी बड़े अक्षरों को मेनू अक्षरों में प्रदर्शित करना चाहते हैं। ऐसा करने के लिए, आपको उन्हें टाइप करने की आवश्यकता नहीं है, जिसमें CapsLock कुंजी, या Shift कुंजी दबाए रखें। यह सीएसएस फ़ाइल में संबंधित नियम बनाकर अपरकेस में प्रदर्शित करने के लिए सभी सूची आइटम सेट करने के लिए पर्याप्त होगा। और यह कई संभावित स्थितियों में से एक है।

पाठ बदलने वाली संपत्ति

हम टेक्स्ट-ट्रांसफ़ॉर्म प्रॉपर्टी का उपयोग करके टेक्स्ट के मामले को नियंत्रित करेंगे। इसके 4 मुख्य मूल्य हैं - अपरकेस (अपरकेस अक्षर), लोअरकेस (लोअरकेस अक्षर), कैपिटलाइज़ करें (शब्द के प्रत्येक पहले अक्षर के लिए अपरकेस, बाकी मूल्य नहीं बदलते हैं), कोई नहीं (कोई स्वरूपण लागू नहीं होता है)। पहली नज़र में, यह सब आपको बहुत जटिल लग सकता है।


मुख्य बात यह है कि घबराओ मत ...

लेकिन व्यवहार में, सब कुछ काफी सरल है, जैसा कि आप अब देखेंगे। कुंजी सही चयनकर्ता चुनना है, क्योंकि पाठ-परिवर्तन संपत्ति के मूल्यों को विरासत में मिला है।

बड़े अक्षरों में हाइलाइटिंग

मेरे द्वारा सुझाई गई पहली बात यह है कि हम सभी पाठों को बड़ा कर सकते हैं, जिसके लिए हम निम्नलिखित सीएसएस नियम बनाते हैं:

शरीर (पाठ-परिवर्तन: अपरकेस;)

सिद्धांत रूप में, कुछ भी जटिल नहीं है, हमने सिर्फ अपरकेस मान का उपयोग किया है। जैसा कि वे कहते हैं, सब कुछ सहज है। यह वास्तविक जीवन में कैसा दिखता है:


बड़े अक्षर के साथ सब कुछ ...

निचला मामला - सभी पर लागू होता है

अगले चरण में, हम हर जगह लोअरकेस अक्षर लागू करते हैं, जिसके लिए हम निम्नलिखित लिखते हैं:

शरीर (पाठ-परिवर्तन: लोअरकेस);

जैसा कि आप अनुमान लगा सकते हैं, जिन दो अर्थों से हम बस मिले हैं वे कुछ विलोम हैं। और नीचे दिए गए चित्रण में, आप नई बनाई गई संपत्ति का परिणाम देख सकते हैं।


लोअरकेस के साथ वेब पेज सक्षम

प्रत्येक शब्द का पहला अक्षर अपरकेस

ऐसा करने के लिए, हमें केवल इसी मूल्य का उपयोग करने की आवश्यकता है:

शरीर (पाठ-परिवर्तन: बड़ा करना;)

मैं नहीं जानता कि आप कितनी बार इस तरह के CSS नियम का उपयोग करेंगे, लेकिन यह इस संभावना के बारे में जानने के लिए आपको नुकसान नहीं पहुंचाएगा, खासकर जब गैर-तुच्छ समस्याओं को हल करना। परिणाम नीचे दी गई छवि में देखा जा सकता है।


कैपिटल अप्लाई के बाद टेक्स्ट

अंत में, चलो अंतिम मूल्य पर एक त्वरित नज़र डालें, कोई नहीं। जैसा कि मैंने कहा, इसका इस्तेमाल एक माता-पिता से विरासत को उलटने के लिए किया जा सकता है। उदाहरण के लिए, आइए कल्पना करें कि हमारे पास पिछले सभी नियम हैं, और पैराग्राफ के लिए हमें उन्हें रद्द करना चाहिए, इसके लिए हम निम्नलिखित लिखते हैं:

पी (पाठ-परिवर्तन: कोई नहीं;)

मैं यह मानने की हिम्मत करता हूं कि आप सब कुछ समझते हैं, यदि नहीं - टिप्पणियों में अपने प्रश्न पूछें। और यह सब मेरे लिए है। मुझे उम्मीद है कि यह सीएसएस ट्यूटोरियल आपके लिए उपयोगी था। यदि ऐसा है तो:

  • इस लेख को सामाजिक नेटवर्क पर फिर से प्रकाशित करें ताकि अधिक लोग इससे लाभान्वित हो सकें;
  • मेरी मेलिंग सूची की सदस्यता लें ताकि उपयोगी और दिलचस्प ब्लॉग पोस्ट को याद न करें।

इस पर मैं आपको अलविदा नहीं कह रहा हूं। आपके ध्यान के लिए धन्यवाद और निम्नलिखित प्रकाशनों में आपको देखा!

हैलो। कभी-कभी वेब पेज बनाते समय, आपको css का उपयोग अपरकेस या सुपरस्क्रिप्ट की स्थिति में करने के लिए कुछ शब्दों को सेट करने की आवश्यकता होती है। आइए देखें कि यह कैसे किया जाता है।

सीएसएस के साथ ऊपरी और निचले मामले

सामान्य तौर पर, आज आप वांछित पाठ को टैग में संलग्न कर सकते हैं और वह डिस्प्ले प्राप्त करें जिसे आप चाहते हैं, लेकिन यह भी देखें कि यह कैसे सीएसएस के साथ किया जा सकता है, क्योंकि तकनीक थोड़ी अलग है।

उदाहरण के लिए, आपको एचटीएमएल दस्तावेज़ में सूत्र एच 2 ओ लिखना होगा। यह इस प्रकार किया जाता है:

  • सूत्र ही लिखा है
  • वे शब्द और संख्याएँ जिन्हें सुपरस्क्रिप्ट या सबस्क्रिप्ट में प्रदर्शित करने की आवश्यकता होती है, उन्हें एक स्पैन टैग में संलग्न किया जाता है, जिसे एक कक्षा निर्दिष्ट करने की आवश्यकता होती है। उदाहरण के लिए: चरित्रों का उत्पादन होना
  • सीएसएस में, आपको इस तत्व को सेट करने की आवश्यकता है:

    शीर्ष-सूचकांक (
    कार्यक्षेत्र-संरेखण: सुपर;
    }

यह गुण पाठ के ऊर्ध्वाधर संरेखण के लिए जिम्मेदार है। इसका सुपर मूल्य निर्दिष्ट करता है कि पाठ सुपरस्क्रिप्ट के रूप में प्रदर्शित किया गया है। लेकिन फ़ॉन्ट का आकार नियमित पाठ के समान ही रहा। चीजों को अच्छा बनाने के लिए, आपको फ़ॉन्ट-आकार की संपत्ति का उपयोग करके फ़ॉन्ट का आकार थोड़ा छोटा करना होगा।

यह है कि संपत्ति बस कैसे काम करती है। तदनुसार, सबस्क्रिप्ट में प्रदर्शित करने के लिए आपको इस तरह लिखना होगा:

शीर्ष-सूचकांक (
कार्यक्षेत्र-संरेखण: उप;
}

समान HTML टैग से अंतर यह है कि ये नियम फ़ॉन्ट आकार को नहीं बदलते हैं, इसलिए यदि आपको ऐसा करने की आवश्यकता है, तो आपको स्टाइलशीट में नए आकार को पंजीकृत करना होगा।

सीएसएस में आपको सुपरस्क्रिप्ट और सबस्क्रिप्ट के बारे में जानना होगा। संपत्ति कोई अतिरिक्त अवसर प्रदान नहीं करती है, और उनकी आवश्यकता भी नहीं है। यदि आप चाहें, तो आप किसी तरह इस पाठ को अनुकूलित कर सकते हैं, लेकिन यह शायद ही कभी आवश्यक है।

यह कहां काम आ सकता है

सुपरस्क्रिप्ट और सबस्क्रिप्ट टेक्स्ट का उपयोग फॉर्मूले लिखते समय, लेखों में नोट्स और अंक जोड़ने के लिए किया जा सकता है। उदाहरण के लिए, विकिपीडिया प्रत्येक लेख के लिए स्रोत और नोट्स उपलब्ध कराता है। लेख के पाठ्यक्रम में, उन्हें छोटे सुपरस्क्रिप्ट के रूप में रखा गया है। यह पाठकों को नाराज नहीं करता है और साथ ही आपको लेखों को वांछित रूप देने की अनुमति देता है।

संपत्ति पूरी तरह से क्रॉस-ब्राउज़र है और सीएसएस के सभी संस्करणों में समर्थित है।

एचटीएमएल टैग तथा - सबस्क्रिप्ट और सुपरस्क्रिप्ट टेक्स्ट

परिभाषा और उपयोग

टैग सबस्क्रिप्ट टेक्स्ट को परिभाषित करता है। सबस्क्रिप्ट आधी ऊंचाई है और बेसलाइन के नीचे दिखाई देती है। रासायनिक सूत्र जैसे एच 2 ओ लिखते समय सबस्क्रिप्ट का उपयोग किया जा सकता है।

टैग सुपरस्क्रिप्ट टेक्स्ट को परिभाषित करता है। सुपरस्क्रिप्ट टेक्स्ट आधी ऊंचाई का है और बेसलाइन के ऊपर दिखाई देता है। डब्ल्यूडब्ल्यूडब्ल्यू जैसे फुटनोट लिखते समय सुपरस्क्रिप्ट टेक्स्ट का उपयोग किया जा सकता है।

ब्राउज़र का समर्थन

टैग तथा सभी प्रमुख ब्राउज़रों द्वारा समर्थित।

HTML और XHTML के बीच अंतर

मानक गुण

स्तंभ DTD निर्दिष्ट करता है कि किस दस्तावेज़ में HTML 4.01 / XHTML 1.0 DTD विशेषता की अनुमति है। एस \u003d सख्त, टी \u003d संक्रमणकालीन और एफ \u003d फ्रेमसेट।

टैग तथा निम्नलिखित मानक विशेषताओं का समर्थन करें:

गुण मूल्य विवरण DTD
कक्षा कक्षा का नाम एक तत्व के लिए वर्ग नाम निर्दिष्ट करता है एसटीएफ
dir rtl
एल टीआर
किसी तत्व में सामग्री के लिए पाठ दिशा निर्दिष्ट करता है एसटीएफ
आईडी पहचानकर्ता एक आइटम के लिए एक विशिष्ट पहचानकर्ता निर्दिष्ट करता है एसटीएफ
लैंग lANGUAGE_CODE किसी तत्व की सामग्री के लिए भाषा कोड निर्दिष्ट करता है एसटीएफ
अंदाज style_definition एक तत्व के लिए एक इनलाइन शैली निर्दिष्ट करता है एसटीएफ
शीर्षक टेक्स्ट किसी आइटम के बारे में अतिरिक्त जानकारी निर्दिष्ट करता है एसटीएफ
xml: लैंग lANGUAGE_CODE XHTML दस्तावेज़ में तत्व सामग्री के लिए भाषा कोड को परिभाषित करता है एसटीएफ

मानक विशेषताओं पर अधिक जानकारी।

घटना के गुण

टैग तथा निम्नलिखित घटना विशेषताओं का समर्थन करें:

गुण मूल्य विवरण DTD
क्लिक पर लिपि माउस-क्लिक की गई स्क्रिप्ट एसटीएफ
ondblclick लिपि डबल-क्लिक की गई स्क्रिप्ट एसटीएफ
onmousedown लिपि माउस क्लिक पर चलाने के लिए स्क्रिप्ट एसटीएफ
onmousemove लिपि जब माउस पॉइंटर ले जाया जाता है तो स्क्रिप्ट चलाने के लिए एसटीएफ
onmouseout लिपि जब माउस एलिमेंट को ले जाता है तो स्क्रिप्ट चलाने के लिए एसटीएफ
मूषक के ऊपर से लिपि जब माउस किसी तत्व पर चलता है तो स्क्रिप्ट चलती है एसटीएफ
onmouseup लिपि माउस बटन जारी होने पर चलाने के लिए स्क्रिप्ट एसटीएफ
onkeydown लिपि एक कुंजी दबाए जाने पर चलाने के लिए स्क्रिप्ट एसटीएफ
onkeypress लिपि जब एक कुंजी दबाया जाता है और फिर जारी किया जाता है तब चलाने के लिए स्क्रिप्ट एसटीएफ
onkeyup लिपि कुंजी जारी होने पर चलाने के लिए स्क्रिप्ट एसटीएफ

के बारे में अतिरिक्त जानकारी