एचटीएमएल टेबल

Question

में कई पंक्तियों में लंबी वाक्य को विभाजित करें और देखें, मेरे विचार में मुझे लंबे वाक्य को HTML तालिका में एकाधिक पंक्तियों में विभाजित करना होगा। मैंने एक कोड इस्तेमाल किया लेकिन यह काम नहीं किया क्योंकि मैं वाक्य को क्लिप नहीं करना चाहता हूं। मैं पूरी वाक्य को कई पंक्तियों में दिखाना चाहता हूं।

इस कोड लाइन मैं प्रयोग किया जाता है:

<td class="col-md-3" style="overflow-wrap:break-word;text-overflow:clip;">@Html.DisplayFor(ModelItem => item.Note, new { @class = "note" })</td> 

Answer 1

आप इस

<td class="col-md-3" style="word-wrap:break-word;">@Html.DisplayFor(ModelItem => item.Note, new { @class = "note" })</td> 

के लिए word-wrap:break-word उपयोग कर सकते हैं यदि आप तो आप उपयोग कर सकते हैं बड़ा शब्द रैप करने के लिए चाहते हैं word-break: break-all

<td class="col-md-3" style="word-break: break-all;">@Html.DisplayFor(ModelItem => item.Note, new { @class = "note" })</td> 

Answer 2

मुझे लगता है कि तालिका सेल डिफ़ॉल्ट ब्रेकword-wrap:break-word जैसी कई पंक्तियों में आपकी वाक्य, यदि आप break-all चाहते हैं तो केवल आप @Super उपयोगकर्ता द्वारा सुझाए गए स्टाइल का उपयोग कर सकते हैं।

डिफ़ॉल्ट ब्रेक लाइन के लिए अपने कोड स्निपेट की जाँच करें:

<table style="border:1px solid #CCC;width:100%"> 
 
     <tr id="accounting" > 
 
      <td>1</td> 
 
      <td>Doe</td> 
 
      <td>John</td> 
 
      <td style="word-break: break-word;">Accounting Personnel testing long line and going to split in two lines if succedd will go ahead.</td> 
 
      <td> 
 
       <div class="actions pull-right approvers">Div 
 
        <a href="#"><i class="fa fa-close" title="remove approvers"></i>Click</a> 
 
       </div> 
 
      </td> 
 
     </tr> 
 
     <tr id="hr" > 
 
      <td class="left"><a>errrrr</a></td> 
 
      <td>Doe</td> 
 
      <td>Luke</td> 
 
      <td>HR Personnel</td> 
 
      <td> 
 
       <div class="actions pull-right approvers">Div 
 
        <a href="#"><i class="fa fa-close" title="remove approvers"></i>Click</a> 
 
       </div> 
 
      </td> 
 
     </tr> 
 
     <tr id="crm" > 
 
      <td>3</td> 
 
      <td>Doe</td> 
 
      <td>Mark</td> 
 
      <td>CRM Personnel</td> 
 
      <td> 
 
       <div class="actions pull-right approvers">Div 
 
        <a href="#"><i class="fa fa-close" title="remove approvers"></i>Click</a> 
 
       </div> 
 
      </td> 
 
     </tr> 
 
    </table>

Answer 3

आप अपने वाक्य को कई पंक्तियों में वितरित करने के लिए और शब्दों को तोड़ा जा नहीं करना चाहती चाहते हैं (जो मैं मान लें कि आपके लिए देख रहे हैं), उपयोग:

word-break: keep-all; 

लेकिन आप कई पंक्तियों में शब्दों को तोड़ने के लिए चाहते हैं, तो यह overflows जब कंटेनर, का उपयोग करें:

word-break: break-all; 

नोट:word-break एक CSS3 संपत्ति है। तो, यह सभी ब्राउज़रों द्वारा समर्थित नहीं है। यह ओपेरा मिनी और आईई संस्करण 11 से पहले समर्थित नहीं है लेकिन ज्यादातर आधुनिक ब्राउज़र द्वारा समर्थित है। आप समर्थित ब्राउज़र here देख सकते हैं।

Answer 4

<td class="col-md-3" style="word-break:break-word;text-overflow:clip;">@Html.DisplayFor(ModelItem => item.Note, new { @class = "note" })</td> 

यह मेरे लिए सही ढंग से काम करता है।

<td class="col-md-3" style="word-break: break-all;">@Html.DisplayFor(ModelItem => item.Note, new { @class = "note" })</td> 

यह भी उपयोगी है। लेकिन यह शब्द भी विभाजित करता है।