एक अवधि में सीएसएस में सभी ब्राउज़र-संगत फांसी इंडेंट शैली कैसे बनाएं

एकमात्र चीज जो मैंने पाया है;

.hang {
    text-indent: -3em;
    margin-left: 3em;
}

इस काम के लिए एकमात्र तरीका एक पैराग्राफ में टेक्स्ट डाल रहा है, जो उन बेहद अस्पष्ट अतिरिक्त लाइनों का कारण बनता है। मैं उन्हें बस चीज़ के प्रकार में रखना चाहूंगा।

मैं फांसी के केवल एक स्तर की तुलना में आगे इंडेंट करने का एक तरीका ढूंढ रहा हूं। इंडेंट्स को ढेर करने के लिए पैराग्राफ का उपयोग करना काम नहीं करता है।

 0
जोड़ा संपादित
विचारों: 12
स्रोत

3 उत्तर

is an inline element. The term hanging indent is meaningless unless you're talking about a paragraph (which generally means a block element). You can, of course, change the margins on

or <div> or any other block element to get rid of extra vertical space between paragraphs.

You may want something like display: run-in, where the tag will become either block or inline depending on context... sadly, this is not yet universally supported by browsers.

0
जोड़ा
स्रोत
अनुक्रम दृष्टिकोण <div> .hang CSS को div पर उपयोग करना होगा, जो मूल रूप से एक अवधि के समान होता है, लेकिन इनलाइन टेक्स्ट की बजाय ब्लॉक तत्व के रूप में होता है। वैकल्पिक रूप से, आप .hang परिभाषा में display: block; शामिल कर सकते हैं, लेकिन उसके बाद फिर से स्पैन का उपयोग div के उपयोग के समान होगा ...
जोड़ा लेखक awe, स्रोत

बस इतना करने के लिए एक अच्छा तरीका मिला, बुरा अवधि कम करें।

p {
  padding-left: 20px; 
} 

p:first-letter {
  margin-left: -20px;
}

अच्छा और सरल: डी

यदि नई लाइनें आपको पी ब्लॉक में परेशान कर रही हैं, तो आप जोड़ सकते हैं

p {
  margin-top: 0px;
  margin-bottom: 0px;
}

JSFiddle उदाहरण

0
जोड़ा
स्रोत
या बस p {text-indent: -20px का उपयोग करें; पैडिंग-बाएं: 20 पीएक्स}
जोड़ा लेखक ysth, स्रोत
मुझे लगता है कि आपका मतलब है ": पहला बच्चा"
जोड़ा लेखक Andy Ford, स्रोत
मुझे नहीं लगता कि यह "पहला बच्चा" होगा। सुनिश्चित नहीं है कि ": पहला अक्षर" यह या तो किया जाएगा। यह मेरे परीक्षणों में काम नहीं करता था। क्या आप एक jsfiddle प्रदान कर सकते हैं?
जोड़ा लेखक Adam Youngers, स्रोत
मैंने निम्नलिखित [लिंक] बनाया (jsfiddle.net/David_Barnett/UqHQv/)। इस विधि में मुझे मिली एकमात्र कमी यह है कि पाठ का चयन करते समय, पहला अक्षर अक्सर चयन करने योग्य नहीं होता है।
जोड़ा लेखक David Barnett, स्रोत
jsfiddle लिंक
जोड़ा लेखक David Barnett, स्रोत
लिंक का कहना है कि मार्जिन गुणों का उपयोग : प्रथम-अक्षर
जोड़ा लेखक gavsiu, स्रोत

ysth का जवाब एक बहस योग्य अपवाद के साथ सबसे अच्छा है; माप की इकाई फ़ॉन्ट के आकार के अनुरूप होना चाहिए।

p {
  text-indent: -2en; 
  padding-left: 2en;
}

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

0
जोड़ा
स्रोत
क्रोम में परीक्षण किया गया और यह en पसंद नहीं है। गुगलिंग en vs em एक डैश-विशिष्ट वर्ण चौड़ाई के रूप में दिखाई देता है, कुछ भी नहीं कहता है कि मैं इसे स्पेसिंग के लिए उपयोग कर सकता हूं।
जोड़ा लेखक agweber, स्रोत