क्या अन्य व्हाट्सएप कोड जैसे & nbsp; आधे-रिक्त स्थान के लिए & nbsp; एम-स्पेस, एन-स्पेस आदि HTML में उपयोगी हैं?


149

आश्चर्य है कि HTML न्यूज़लेटर में उपयोग करने के लिए अन्य कोड उपलब्ध हैं।

मैं सेल पैडिंग या मार्जिन का उपयोग करूंगा लेकिन मैं इस HTML / CSS चीज़ के लिए नया हूं और मुझे ऐसा परिवर्तन नहीं मिल सकता है जो इसके अंतर्गत मुख्य शीर्षक पंक्ति और उप-प्रमुख दोनों को प्रभावित करता हो। एक ईमेल होने के नाते मैं सीएसएस के साथ घूमने जाने में संकोच कर रहा हूं ताकि इसे प्राप्त किया जा सके - क्योंकि मुझे नहीं पता कि इनलाइन मार्कअप के विपरीत सीएसएस के रास्ते में ईमेल क्लाइंट क्या पसंद नहीं करते हैं।

संदर्भ के लिए मैं जिस टेम्पलेट का उपयोग कर रहा हूं, वह Mailchimp स्निप से म्यूट थीम है:

    <!-- language: lang-html -->
<table cellspacing="0" cellpadding="0" border="0" align="center" width="626">
    <tbody>
        <tr>
            <td valign="middle" bgcolor="#546781" height="97" background="images/header-bg.jpg" style="vertical-align: middle;">
                <table cellspacing="0" cellpadding="0" border="0" align="center" width="555" height="97">
                    <tbody>
                        <tr>
                            <td valign="middle" width="160" style="vertical-align:middle; text-align: left;">
                                <img width="70" height="70" src="http://dl.dropbox.com/…….png" style="margin:0; margin-top: 4px; display: block;" alt="" />
                            </td>
                            <td valign="middle" style="vertical-align: middle; text-align: left;">
                                <h1 class="title" style="margin:0; padding:0; font-size:30px; font-weight: normal; color: #192c45 !important;">
                                    <singleline label="Title"><span>Title of Report</span></singleline>
                                </h1>
                                <h1 class="title" style="margin:0; padding:0; font-size:15px; font-weight: normal; color: #192c45 !important;">
                                    <singleline label="Title"><span>Small Subhead</span></singleline>
                                </h1>
                            </td>
                            <td width="55" valign="middle" style="vertical-align:middle; text-align: center;">
                                <h2 class="date" style="margin:0; padding:0; font-size:13px; font-weight: normal; color: #192c45 !important; text-transform: uppercase; font-weight: bold; line-height:1;">
                                    <currentmonthname />December
                                </h2>
                                <h2 class="date" style="margin:0; padding:0; font-size:23px; font-weight: normal; color: #192c45 !important; font-weight: bold;">
                                     <currentyear />2011
                                </h2>
                            </td>

                        </tr>
                    </tbody>
                </table>
            </td>
        </tr>

वेब पेज के रूप में पूरा ईमेल यहाँ देखा जा सकता है

जवाबों:


381

हाँ, कई

सहित, लेकिन सीमित नहीं:

  • गैर ब्रेकिंग स्पेस: &#160;या&nbsp;
  • संकीर्ण नो-ब्रेक स्पेस: &#8239;(कोई वर्ण संदर्भ उपलब्ध नहीं)
  • एन स्पेस: &#8194;या&ensp;
  • उन्हें अंतरिक्ष: &#8195;या&emsp;
  • 3-प्रति-एम स्पेस: &#8196;या&emsp13;
  • 4-प्रति-एम स्पेस: &#8197;या&emsp14;
  • 6-प्रति-एम स्पेस: &#8198;(कोई वर्ण संदर्भ उपलब्ध नहीं)
  • आंकड़ा स्थान: &#8199;या&numsp;
  • विराम चिह्न स्थान: &#8200; या&puncsp;
  • पतली जगह: &#8201; या&thinsp;
  • बाल स्थान: &#8202; या&hairsp;

span{background-color: red;}
<table>
<tr><td>non breaking space:</td><td> <span>&#160;</span> or <span>&nbsp;</span></td></tr>
<tr><td>narrow no-break space:</td><td> <span>&#8239;</span></td></tr>
<tr><td>en space:</td><td> <span>&#8194;</span> or <span>&ensp;</span></td></tr>
<tr><td>em space:</td><td> <span>&#8195;</span> or <span>&emsp;</span></td></tr>
<tr><td>3-per-em space:</td><td> <span>&#8196;</span> or <span>&emsp13;</span></td></tr>
<tr><td>4-per-em space:</td><td> <span>&#8197;</span> or <span>&emsp14;</span></td></tr>
<tr><td>6-per-em space:</td><td> <span>&#8198;</span></td></tr>
<tr><td>figure space:</td><td> <span>&#8199;</span> or <span>&numsp;</span></td></tr>
<tr><td>punctuation space:</td><td> <span>&#8200;</span> or <span>&puncsp;</td></tr>
<tr><td>thin space:</td><td> <span>&#8201;</span> or <span>&thinsp;</span></td></tr>
<tr><td>hair space:</td><td> <span>&#8202;</span> or <span>&hairsp;</span></td></tr>
</table>


3
फ़ायरफ़ॉक्स उपरोक्त सभी स्थानों को समान चौड़ाई के रूप में प्रस्तुत करता है, फ़ॉन्ट के एक स्थान से अधिक, nbsp को छोड़कर, जहाँ यह एक स्थान के रूप में प्रस्तुत होता है और गैर-ब्रेकिंग वर्ण को लागू करता है। एक असली शर्म। ऐसे मामले हैं जहां केवल एक चरित्र करेगा, उदाहरण के लिए जब पैडिंग को नियंत्रित किया जा रहा है या निर्माण के साथ कुछ और पारित किया जा रहा है जैसेbefore:
fyngyrz

2
@fyngyrz लिनक्स पर कम से कम फ़ायरफ़ॉक्स 54 में, यह सच नहीं है (अब)। यह फ़ॉन्ट पर भी निर्भर हो सकता है; मैंने इसे स्टैक ओवरफ्लो पर परीक्षण किया है, जहां एरियल फ़ॉन्ट परिवार का उपयोग किया जाता है।
बस एक छात्र

5
किसी के लिए भी जो सिर्फ यह देखना चाहता है कि यह व्हाट्सएप कैसे jsfiddle.net/LcLg5u25 की
वादिम ओविचनिकोव

2
संख्या $numsp;संरेखित करने के लिए आंकड़ा स्थान बहुत उपयोगी है, क्योंकि अंतरिक्ष को उसी फ़ॉन्ट में एक संख्या के रूप में व्यापक रूप से परिभाषित किया गया है।
रूडी

2
विंडोज पर फ़ायरफ़ॉक्स अब ठीक है (v.61) BTW।
एमएससी

13

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

तो सीएसएस का उपयोग करना सुरक्षित है और आपको निश्चित-चौड़ाई वाले रिक्त स्थान की विशिष्ट चौड़ाई ही नहीं, बल्कि किसी भी वांछित स्थान को निर्दिष्ट करने देता है। यदि आप बस अपने h2 तत्वों के आस-पास स्पेसिंग जोड़ना चाहते हैं, जैसा कि मुझे लगता है, तो उन तत्वों पर पैडिंग सेट करना (पैडिंग का मान बदलना: 0 सेटिंग्स जो आपके पास पहले से हैं) ठीक काम करना चाहिए।


धन्यवाद मैंने इनलाइन विशेषता <h1 वर्ग = "शीर्षक" शैली = "मार्जिन: 0; मार्जिन-वाम: 2px; गद्दी: 0; फ़ॉन्ट-आकार: 15px; फ़ॉन्ट-भार: सामान्य; रंग: # 192c45; का उपयोग करके समाप्त किया। ; "> मुझे लगता है कि भले ही यह फ़ॉन्ट परिवार के लिए सबसे सुरक्षित है, लेकिन हेल्वेटिका नीयू आदि
wide_eyed_pupil

लेकिन अगर वे विरासत में हैं और 'चरित्र सेट में शामिल हैं, तो केवल मौजूदा चरित्र डेटा में उनकी उपस्थिति के कारण' का मतलब है कि वे जल्द ही दूर नहीं जा रहे हैं। मैं वास्तव में आपको तर्क नहीं देखता। मुझे लगता है कि 'आधा स्थान' की तलाश में किसी को भी 'उन्नत' होना शायद पहले से तय है कि मार्जिन या पैडिंग उपयुक्त नहीं है। मैंने (&thinsp;4 PACK&thinsp;)अपनी आवश्यकताओं के लिए समझौता किया - मार्जिन या पैडिंग का उपयोग करना इस के लिए एक भयानक विचार होगा
शमौन_वेर

1
@Simon_Weaver, जैसा कि मैं वर्णन करता हूं, निश्चित-चौड़ाई वाले अंतरिक्ष वर्ण मज़बूती से काम नहीं करते हैं। वे एक कुंद उपकरण भी हैं: चौड़ाई का एक निश्चित सेट, हालांकि वास्तविक चौड़ाई फ़ॉन्ट-निर्भर हैं, जैसे फ़ॉन्ट-स्वतंत्र सेटिंग्स के विपरीत <span style="padding: 0 0.1em">4 PACK</span>, मानों को सेट करने और ट्यूनिंग में स्वतंत्रता के साथ।
जुक्का के। कोर्पेला

1
हालांकि यह काफी पुराना है, पीटर के शीरिन का "द ट्रबल विद ईएम 'एन एन (और अन्य छायादार अक्षर)" ( alistapart.com/article/emen ) इस विषय पर अभी भी उपयोगी है। विशेष रूप से — यद्यपि यह पिछले 14 वर्षों में बेहतर हो सकता है-यह तथ्य कि सभी f̶o althoughn̶t̶s render टाइपफेस विभिन्न स्थानों को सही ढंग से प्रस्तुत नहीं करते हैं।
डेव लैंड

1
इसमें ZERO WIDTH JOINER fileformat.info/info/unicode/char/200d/index.htm भी है और ZERO WIDTH NON JOINERमैं शून्य-चौड़ाई वाले स्थानों की तुलना में अधिक बार उपयोग करता हूं।
Reb.Cabin

9

निश्चित नहीं है कि यह वही है जिसका आप उल्लेख कर रहे हैं, लेकिन यह उन HTML संस्थाओं की सूची है जिनका आप उपयोग कर सकते हैं:

XML और HTML चरित्र इकाई संदर्भों की सूची

'नाम' कॉलम में दी गई सामग्री का उपयोग करके आप सिर्फ एक में इन लपेट कर सकते हैं &और;

जैसे &nbsp;, &emsp;आदि।


तो चिह्नित पाठ के संदर्भ में ('<p>' और '</ p>' के अंदर '' और 'एक यूनिकोड ग्लिफ़ नाम को दर्शाता है, ठीक है?' क्या है? ') इसके लिए एक स्पेस चार सिग्नल नहीं देता है। यह ब्राउज़र द्वारा पार्स किया गया है?
wide_eyed_pupil

क्लोजिंग सेमी कोलोन एक अर्थ में वैकल्पिक है क्योंकि HTML पार्सर अभी भी व्हॉट्सएप को संदर्भ के अंत के रूप में देखेगा। हालाँकि विनिर्देश कहता है कि आपको " सेमी " एक सेमीकॉलन के साथ समाप्त होना चाहिए ( w3.org/TR/html5/syntax.html#character-references )
isNaN1247

PS - यदि आप इसे उत्तर के रूप में चिह्नित करते हैं, तो मैं फिर भी इसकी सराहना करूंगा - अगर आपको लगता है कि यह आपके प्रश्न का उत्तर दे दिया है :)
isNaN1247

2

मैंने इस यूनिकोड दशमलव कोड &#8204;का उपयोग किया और काम किया। अधिक जानकारी


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

1

सामान्य एन्कोडेड व्हाइट-स्पेस चरित्र के बारे में क्या?

&#32;
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.