एचटीएमएल में, क्या एक शब्द रैपिंग संकेत डालना संभव है?

Question

कल्पना कीजिए मैं एक लंबे, बहु-शब्द एक DIV में पाठ की पंक्ति है:

नमस्कार, प्रिय ग्राहक। कृपया हमारे प्रस्ताव पर एक नज़र डालें।

डीआईवी की गतिशील चौड़ाई है। मैं ऊपर दिए गए पाठ को लपेटना चाहता हूं।

|-DIV WIDTH------------------------------------| 
Hello there, dear customer. Please have a look 
at our offer. 

मैं पसंद करेंगे कि रैपिंग वाक्य सीमा पर हो: वर्तमान में, रैपिंग एक शब्द सीमा जो पहली लाइन की लंबाई अधिकतम पर होता है। हालांकि, अगर कोई लपेटना जरूरी नहीं है, तो मैं लाइन को एक जैसा रहना चाहूंगा।

मेरी बात समझाने के लिए, कृपया विभिन्न DIV चौड़ाई को देखो और कैसे मैं अपने पाठ रैप करने के लिए करना चाहते हैं:

|-DIV WIDTH--------------------------------------------------------| 
Hello there, dear customer. Please have a look at our offer. 
|-DIV WIDTH-----------------------------------| 
Hello there, dear customer. 
Please have a look at our offer. 
|-DIV WIDTH--------| 
Hello there, dear 
customer. 
Please have a look 
at our offer. 

शब्दों के साथ

, आप एक नरम हाइफन का उपयोग कर सकते हैं, जिससे कि शब्द रैपिंग पर होता है सुझाव दिया अक्षर सीमाएं। यदि कोई रैपिंग की आवश्यकता नहीं है, तो ­ अदृश्य रहता है।

magnifi­cently 

वहाँ HTML में शब्द-रैपिंग इशारा के लिए एक अनुरूप विधि है: रैपिंग आवश्यक है, ­ जहां ऐसा होता है?

Answer 1

शब्दों में ­ शब्दों या <wbr> शब्दों के बीच, <wbr> एक हाइफ़न पेश नहीं करेगा।

यह भी देखें:

• quirksmode: <wbr> compat list

Answer 2

बिल्कुल बिल्कुल नहीं, लेकिन बंद करें: http://jsfiddle.net/uW4h8/1/।

संक्षेप में, आपको टेक्स्ट कंटेनर के लिए white-space: nowrap; सेट करना चाहिए और वांछित शब्दों के बीच ब्रेक डालने के लिए <wbr> का उपयोग करना चाहिए।

Answer 3

एक-ब्रेक स्पेस U + 00A0 (या   आप जैसे चरित्र में प्रवेश का कोई सुविधाजनक तरीका है तो) शब्दों के बीच जब एक पंक्ति का उपयोग करें ब्रेक की अनुमति नहीं है, और सामान्य स्थान अन्यथा।

यह तब काम नहीं करेगा जब शब्दों में हाइफ़न "-" होता है, और कुछ अन्य वर्ण, जैसे कि कोष्ठक, समस्याएं भी हो सकती हैं, क्योंकि कुछ ब्राउज़र उन्हें उनके बाद लाइन ब्रेक की इजाजत देते हैं। समस्याओं के साथ मुकाबला करने की विभिन्न तकनीकों सहित, लंबे समय तक ग्रंथ के लिए http://www.cs.tut.fi/~jkorpela/html/nobr.html देखें। लेकिन अगर आपके पास सामान्य विराम चिह्न के साथ सामान्य शब्द हैं और कोई हाइफ़न नहीं है, तो आपको सरल दृष्टिकोण के साथ ठीक होना चाहिए।

Answer 4

तत्व <wbr> और   अक्सर काम करते हैं, लेकिन हमेशा नहीं। वे एक स्थिर लैंडिंग पृष्ठ को डिजाइन करते समय विशेष रूप से समस्याग्रस्त होते हैं (ए) को विभिन्न स्क्रीन और ब्राउज़रों पर काम करना पड़ता है और (बी) को अच्छा दिखना पड़ता है।

इस मामले में मैं विभिन्न स्क्रीन संकल्पों पर लाइन-ब्रेक संकेतों पर नियंत्रण चाहता हूं। ऐसा करने के लिए, मैं <br> टैग और सीएसएस का उपयोग करता हूं। अगर यह जटिल हो जाता है तो यह एक गड़बड़ हो सकता है, लेकिन मुझे लगता है कि यह एक बिंदु तक काम करता है।उदाहरण के लिए:

<p class='break-hints'> 
Hello there, dear customer. <br class='break-big'> 
Please have a look <br class='break-small'> at our offer. 
</p> 

मैं तो संकेत मिलता है जब विभिन्न टूटता शुरू हो जाना चाहिए मीडिया क्वेरी के साथ सीएसएस का उपयोग करें।

p.break-hints br { 
    display: none; 
} 

@media only screen and (max-width: 300px) { 
    p.break-hints br.break-small { 
    display: inline; 
    } 
} 

p.break-hints br.break-big { 
    display: inline; 
}