मैं पृष्ठ के बॉडी में सीएसएस कक्षा से स्टाइल जानकारी कैसे ओवरराइड कर सकता हूं?

तो मैं एक ऐसे प्रोजेक्ट पर काम कर रहा हूं जो एचटीएमएल को इनपुट के रूप में स्वीकार करता है और उन्हें आउटपुट के रूप में लौटाता है। इनपुट के रूप में मुझे प्राप्त होने वाले सभी HTML में उनके सभी टेक्स्ट divs और स्टाइल शीट्स में होते हैं जो क्लास एट्रिब्यूट के आधार पर प्रत्येक div के लिए शैली को निर्देशित करते हैं।मैं पृष्ठ के बॉडी में सीएसएस कक्षा से स्टाइल जानकारी कैसे ओवरराइड कर सकता हूं?

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

[संपादित करें] मैं जो कुछ ढूंढ रहा हूं उसे बेहतर तरीके से समझाने के लिए एक उदाहरण प्रदान करना चाहता हूं। मैं अपने पेज के शीर्ष पर है (कि मैं ओवरराइड करना चाहते) स्टाइल शीट का एक उदाहरण है:

.style21{vertical-align:top;font-size:13px;font-family:Helvetica;color:#000000;}

एक div जिसका रंग मैं बदलना चाहते हैं का एक उदाहरण है:

<div style="position:absolute;top:432;left:422;color:#ff0000;"><span class="style21">relating to</span></div>

मेरी समस्या यह है कि मैं सीएसएस में निर्दिष्ट रंग को ओवरराइड नहीं कर सकता। जैसा कि आप उपर्युक्त उदाहरण में देख सकते हैं, मैं इसे div के भीतर विशिष्ट शैली में करने की कोशिश कर रहा हूं, लेकिन यह काम नहीं कर रहा है। [/ संपादित करें]

स्रोत

2011-03-21 Eli

या तो में उपयोग कर सकते हैं अपने divs पर सीएसएस इनलाइन जोड़ने के लिए शैली विशेषता का उपयोग, उदा .:

<div style="color:red"> ... </div>

...या अपनी स्टाइल शीट बनाएं और मौजूदा स्टाइलशीट के बाद इसका संदर्भ लें तो आपकी स्टाइल शीट को प्राथमिकता लेनी चाहिए।

... या अपने एचटीएमएल के <head> मेंमें <style> तत्व जोड़ें, जो आपको आवश्यक सीएसएस के साथ प्राथमिकता लेगा।

आप अपनी शैली मानों को उसी तत्व पर अन्य शैलियों को ओवरराइड करने के बाद !important भी जोड़ सकते हैं।

अद्यतन

उपयोग ऊपर मेरी सुझावों में से एक और युक्त div class style21 की अवधि के बजाय लक्ष्य। जिस शैली में आप शामिल div पर आवेदन कर रहे हैं उसे स्पैन द्वारा विरासत में नहीं मिला क्योंकि यह रंग स्टाइल शीट में सेट है।

स्रोत

2011-03-21 19:10:38 Graham

अपडेट ने सब कुछ मेरे लिए काम किया। धन्यवाद! – Eli

धन्यवाद मुझे नहीं पता था कि इनलाइन शैली में अधिक वरीयता है – Faizan

आप की तरह <div style="color:red";>...</div>

स्रोत

2011-03-21 19:00:56 Hussein

धन्यवाद लागू किया जाएगा। यही वह है जो मैंने मूल रूप से कोशिश की थी, लेकिन ऐसा लगता है कि यह सीएसएस को ओवरराइड नहीं करता है, जो मुझे यहां पोस्ट करने के लिए प्रेरित करता है। कोई अन्य विचार? – Eli

@ एली, आपके द्वारा स्वीकार किया गया उत्तर वह उत्तर है जो मैंने पहले प्रदान किया था। क्या हुआ। – Hussein

@ हुसैन, मुझे लगता है कि ऐसा इसलिए है क्योंकि मैंने उनके प्रश्न का उत्तर दिया ;-) – Graham

सीएसएस इनलाइन लेखन आप HTML फ़ाइल के head में सीएसएस रख सकते हैं द्वारा एक रंग परीक्षण कर सकते हैं, और यह एक शामिल शैली पत्रक में एक वर्ग के ऊपर मिसाल ले जाएगा।

<style> 
.thing{ 
    color: #f00; 
} 
</style>

स्रोत

2011-03-21 19:01:58

क्या आपने शैली पर महत्वपूर्ण ध्वज का उपयोग करने का प्रयास किया है? महत्वपूर्ण यह तय करने की अनुमति देता है कि कौन सी शैली जीत जाएगी। यह भी ध्यान दें! महत्वपूर्ण इनलाइन शैलियों को भी ओवरराइड करेगा।

#example p { 
    color: blue !important; 
} 
... 
#example p { 
    color: red; 
}

एक और जोड़े को सुझाव:

वर्तमान के अंदर एक अवधि जोड़ें। भीतर का सबसे अधिक जीत जाएगा। हालांकि यह बहुत बदसूरत हो सकता है।

<span class="style21"> 
<span style="position:absolute;top:432px;left:422px; color:Red" >relating to</span> 
</span>

jQuery भी एक विकल्प है। JQuery लाइब्रेरी लक्षित तत्व में शैली विशेषता इंजेक्ट करेगा।

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js" type="text/javascript" ></script> 
    <script type="text/javascript"> 

     $(document).ready(function() { 
      $("span").css("color", "#ff0000"); 
     }); 

    </script>

उम्मीद है कि इससे मदद मिलती है। सीएसएस कई बार निराशाजनक हो सकता है।

स्रोत

2011-03-21 19:02:50

कोशिश की। काम नहीं किया :( – Eli

क्या आप शैलियों को उस तत्व के अंदर रख सकते हैं जिसे आप किसी अन्य तत्व में लपेटने के विपरीत ओवरराइड करना चाहते हैं? मैंने अभी उपरोक्त उदाहरण को फिर से बनाया है! महत्वपूर्ण काम नहीं करेगा बल्कि शैली को सीधे अवधि में जोड़ देगा टैग करता है। –

आप सिर का उपयोग कर सकते अगर <style> /*...some style */ </style> रास्ता हुसैन आप
और अल्ट्रा hacky <style> </style> एचटीएमएल यह काम करेगा, लेकिन इसके बदसूरत में दिखाया जोड़ें। या जावास्क्रिप्ट यह सबसे अच्छा तरीका है अगर आप आप मामले

स्रोत

2011-03-21 19:05:49 webLacky3rdClass

एली, यह याद रखना महत्वपूर्ण है कि सीएसएस विशिष्टता में एक लंबा रास्ता तय होता है। यदि आपका इनलाइन सीएसएस उपयोग कर रहा है! महत्वपूर्ण है और आयातित स्टाइलशीट नियमों को ओवरराइड नहीं कर रहा है तो फ़ायरफ़ॉक्स के लिए 'फ़ायरबग' जैसे टूल का उपयोग करके कोड को बारीकी से देखें। यह आपको आपके तत्व पर लागू होने वाला सीएसएस दिखाएगा। यदि कोई वाक्यविन्यास त्रुटि है तो फ़ायरबग आपको चेतावनी पैनल में दिखाएगा कि उसने घोषणा को बाहर कर दिया है।

यह भी याद रखें कि आम तौर पर एक आईडी एक वर्ग से अधिक विशिष्ट है तत्व से अधिक विशिष्ट है।

उम्मीद है कि मदद करता है।

-रिक

स्रोत

2011-03-21 19:31:31 dolbysurnd

ईद के classnames करने से पहले कर रहे हैं।
टैग attribue 'style =' सीएसएस चयनकर्ताओं से पहले है।
!important शब्द पहले दो नियमों से पहले है।
अधिक विशिष्ट सीएसएस चयनकर्ता कम विशिष्ट से पहले हैं। अधिक विशिष्ट लागू किया जाएगा।

उदाहरण के लिए

.divclass .spanclass से .spanclass
.divclass.divclass से .divclass
#divId .spanclass अधिक विशिष्ट है आईडी कि है यह से .divClass .spanClass
<div id="someDiv" style="color:red;"> विशेषता है और अधिक विशिष्ट क्यों है अधिक विशिष्ट है और #someDiv{color:blue}
शैली: #someDiv{color:blue!important} सलाह के लिए विशेषता से अधिक style="color:red"

स्रोत

2011-03-21 19:46:50 Johnner

मैंने कभी सोचा नहीं लागू करने के स्टाइल ऑर्डर को भी प्रभावित करता है! – Daria

मैं पृष्ठ के बॉडी में सीएसएस कक्षा से स्टाइल जानकारी कैसे ओवरराइड कर सकता हूं?

उत्तर

संबंधित मुद्दे