स्प्यान ट्याग र CSS सँग शब्दको रंग कसरी परिवर्तन गर्ने?

CSS सँग , कागजातमा पाठको रङ सेट गर्न सजिलो छ। यदि तपाइँले तपाइँको पृष्ठमा अनुच्छेदहरू निश्चित रंगमा गाईने चाहानुहुन्छ भने, तपाईंले मात्र निर्दिष्ट गर्नुहुने छ कि तपाईंको बाह्य शैली पानामा र ब्राउजरले तपाइँको पाठले रोजिएको रंगमा प्रदर्शन गर्नेछ। त्यसपछि के हुन्छ जब पाठको अनुच्छेद भित्र मात्र एक शब्द (वा सायद केही शब्दहरू) परिवर्तन गर्न चाहानुहुन्छ? यसको लागि, तपाईंलाई ट्याग जस्तो इनलाइन तत्व प्रयोग गर्न आवश्यक छ।

अन्ततः, एकल शब्दको रंग परिवर्तन गर्न वा वाक्य भित्र शब्दहरूको सानो समूह CSS को प्रयोग गरेर सजिलो छ, र ट्याग मान्य HTML हो, त्यसैले केहि प्रकारको हैकबारे चिन्ता नगर्नुहोस्। यस दृष्टिकोणको साथ, तपाईं निराश ट्यागहरू र "फन्ट" जस्ता विशेषताहरू प्रयोग गर्नबाट बच्न सक्नुहुन्छ, जुन बाइबोन HTML युगको एक उत्पादन हो।

यो लेख सुरु वेब विकासकर्ताहरूको लागि जुन सम्भवतः HTML र CSS मा नयाँ छ। यसले तपाईंको पृष्ठमा विशेष पाठको रंग परिवर्तन गर्न एचटीएमएल ट्याग र सीएसएस कसरी प्रयोग गर्ने भनेर जान्दछ। यो भनिएको छ, यस विधिमा केही कमजोरीहरू छन्, जुन म यस लेखको अन्त्यमा समावेश गर्नेछु। अहिलेका लागि यो पाठ रङ परिवर्तन गर्न चरणहरू सिक्न पढ्नुहोस्! यो धेरै सजिलो छ र लगभग 2 मिनेट लिन पर्छ।

कदम चरण द्वारा निर्देश

1. तपाईंको मनपर्ने पाठ HTML सम्पादकमा अद्यावधिक गर्न चाहानु भएको वेब पेज खोल्नुहोस्। यो Adobe Dreamweaver वा एक साधारण पाठ सम्पादक जस्तो नोटपैड, नोटप्याड ++, TextEdit, आदि जस्तै कार्यक्रम हुन सक्छ।
2. कागजातमा, तपाईंले पृष्ठमा फरक रङमा प्रदर्शन गर्ने शब्दहरू पत्ता लगाउनुहोस्। यो ट्यूटोरियलको लागि, केहि शब्दहरू प्रयोग गर्नुहोस् जुन पाठको ठूलो अनुच्छेद भित्र हो। त्यो पाठ टुग्याग जोडा भित्र समावेश हुनेछ। एउटा दुई शब्दहरू मध्ये एउटा फेला पार्नुहोस् जसको रंग तपाई सम्पादन गर्न चाहनुहुन्छ।
3. शब्दमा पहिलो वर्ण भन्दा पहिले तपाईका कर्सर राख्नुहोस् वा शब्दहरूको समूह जुन तपाइँ परिवर्तन गर्न चाहानुहुन्छ। सम्झनुहोस्, यदि तपाईं WYSIWYG सम्पादक प्रयोग गर्दै हुनुहुन्छ भने Dreamweaver, तपाई अहिले "कोड दृश्य" रिगथमा काम गर्दै हुनुहुन्छ।
4. पाठको लम्बाइ दिनुहोस् जसको रंग हामी ट्यागसँग परिवर्तन गर्न चाहन्छौं, एक क्लास विशेषता सहित। सम्पूर्ण अनुच्छेद यो जस्तो देखिन्छ: यो पाठ हो जुन एक वाक्यमा केंद्रित छ।
5. हामीले भर्खरै इनलाइन तत्व प्रयोग गर्यौं, त्यस विशिष्ट पाठलाई "हुक" दिनुहोस् जुन हामी CSS मा प्रयोग गर्न सक्छौं। हाम्रो अर्को चरण नयाँ नियम थप्नको लागि हाम्रो बाह्य CSS फाइलमा लैजानुहोस्।

1. हाम्रो CSS फाइलमा, आइपुग्छ:
   1. .focus-text {
   2. रंग: # F00;
   3. }
2. यो नियमले अनलाईन तत्व सेट गर्दछ, रङ रातोमा प्रदर्शन गर्न। यदि हाम्रो अघिल्लो शैली थियो जुन हाम्रो कागजातको पाठलाई ब्ल्याकमा सेट गर्दछ, यो इनलाइन शैलीले स्पेस पाठलाई ध्यान केन्द्रित गर्न र फरक रङसँग खडा गर्नेछ। हामी यस नियममा अन्य शैलहरू पनि थप्न सक्दछौं, सम्भवतः पाठ इटालियन वा बोल्ड बनाउने यो अझ बढी जोड दिन सक्छ?
3. तपाइँको पृष्ठ सुरक्षित गर्नुहोस्।
4. परिवर्तनहरू परिवर्तन गर्नको लागि पृष्ठलाई तपाइँको मनपर्ने वेब ब्राउजरमा परीक्षण गर्नुहोस्।
5. ध्यान दिनुहोस् कि, केहि वेब प्रोफेसरहरू अन्य तत्वहरू जस्तै ट्याग जोडीहरू प्रयोग गर्न छनौट गर्नुहोस्। यी ट्यागहरू "बोल्ड" र "एट्रिटिक" को लागि विशेष रूपमा प्रयोग गर्थे, तर बेपत्ता भएका थिए र यसको साथमा बदलियो। ट्याग अझै पनि आधुनिक ब्राउजरहरूमा काम गर्दछ, तथापि, धेरै वेब विकासकहरूले तिनीहरूलाई इनलाइन स्टाइल हुकको रूपमा प्रयोग गर्छन्। यो सबै भन्दा नराम्रो दृष्टिकोण होइन, तर तपाईं कुनै निराश तत्वहरूबाट बचाउन चाहानुहुन्छ भने, म यी प्रकारको स्टाइल आवश्यकताका लागि ट्यागको साथ सुझाव दिन्छु।

सुझावहरू र कुराहरू हेर्नका लागि बाहिर

जबकि यो दृष्टिकोणले सानो स्टाइल आवश्यकताहरूको लागि राम्रो काम गर्दछ, जस्तै यदि तपाइँ कागजातमा एक सानो टुक्राको पाठ परिवर्तन गर्न आवश्यक छ, यसले चाँडै नियन्त्रणबाट बाहिर जान सक्छ। यदि तपाईंले फेला पार्नुभयो कि तपाईंको पृष्ठ इनलाइन तत्वहरूसँग लुटिएको छ, सबैसँग तपाईंको सीएसएस फाइलमा प्रयोग गरिएका अनन्य क्लासहरू छन्, तपाईले यसलाई गलत गर्न सक्नुहुनेछ, सम्झनुहोस्, यी ट्यागहरू जुन तपाईँको पृष्ठमा छन्, ती कठिन सम्भव छ कि पृष्ठलाई अगाडि बढ्नको लागि सम्भव छ। यसबाहेक, राम्रो वेब टाइपोग्राफी शायद नै पृष्ठ मा धेरै रंगहरु, आदि को धेरै भिन्नता छ!