क्या पाठ नोड्स के लिए सीएसएस चयनकर्ता है?

Question

मैं क्या करना चाहूंगा (आईई स्पष्ट रूप से नहीं) यह है:

p:not(.list):last-child + :text {
  margin-bottom: 10px;
}

जो एक पाठ नोड को एक मार्जिन देगा। (क्या यह भी संभव है?) मुझे सीएसएस के साथ टेक्स्ट नोड कैसे मिलेगा?

Comments

आप का उपयोग कर अनुमानित कर सकते हैं ::first-line, हालांकि जैसा कि नाम से पता चलता है, यह केवल पाठ की पहली पंक्ति पर लागू होता है। (इसके अलावा, मुझे लगता है कि केवल कुछ संपत्तियों को इस पर सेट किया जा सकता है)

— मार्क गार्सिया

Answer 1

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

Comments

मैं अभी भी सख्त याद कर रहा हूँ :: पाठ नोड्स के पहले और बाद में।

— शबूनक

I'm nevertheless desperately missing ::before and ::after on text nodes.वास्तव में। वे स्वरूपण नहीं ले सकते हैं, लेकिन वे निश्चित रूप से लेते हैं content।

— Syntech

यह एक पूरी तरह से उचित सवाल है कि टेक्स्ट नोड को कैसे लक्षित किया जाए। मुझे पता है कि ओपी ने विशेष रूप से "मार्जिन" कहा था, लेकिन उनकी अन्य शैलियाँ हैं जिन्हें एक टेक्स्ट नोड पर लागू किया जा सकता है और जिसे आप टेक्स्ट नोड पर लागू करना चाहते हैं, न कि मूल नोड पर। उदाहरण के लिए, मान लें कि मैं पाठ के नीचे एक सीमा तल चाहता था। उस सीमा को पाठ नोड पर लागू करने से वांछित परिणाम होगा, लेकिन माता-पिता को तलाक कहने के लिए इसे लागू करने से, पूरे div के आसपास एक निचला सीमा बन जाएगी। दुर्भाग्य से, सीएसएस आपको HTML तत्वों को जोड़ने के साथ पाठ नोड को लक्षित नहीं करने देता ... कम से कम अब तक।

— VKK

आप इसके लिए फ़ॉन्ट सेट कर सकते हैं, निश्चित रूप से काम करता है, लेकिन कोई अन्य शैली लागू नहीं होती है

— हामिद बाह्मनाबादी

आप केवल एक अभी के लिए इस तरह सामान कर सकते हैं stackoverflow.com/questions/10645552/...

— fearis

Answer 2

आप सीएसएस के साथ पाठ नोड्स को लक्षित नहीं कर सकते। मैं तुम्हारे साथ हूँ; काश तुम ... लेकिन तुम नहीं कर सकते :(

यदि आप <span> @Jacob की तरह टेक्स्ट नोड को लपेटते नहीं हैं , तो आप इसके paddingविपरीत आसपास के तत्व को दे सकते हैं margin:

एचटीएमएल

<p id="theParagraph">The text node!</p>

सीएसएस

p#theParagraph
{
    border: 1px solid red;
    padding-bottom: 10px;
}