如何在bootstrap 3網格中獲得響應文本？

我想讓下面的代碼以瀏覽器窗口大小的方式工作，以便每個網格單元格中的文本始終保留在屏幕上。如果沒有更多的空間來顯示文本，並且我希望文本在行上被拆分，則由於某種原因，以下代碼會削減文本的末尾。如何在bootstrap 3網格中獲得響應文本？

<html> 
<head> 
    <title></title> 
    <script src="scripts/jquery-2.0.3.js"></script> 
    <link href="bootstrap/css/bootstrap.css" rel="stylesheet" /> 
    <script src="bootstrap/js/bootstrap.js"></script> 
</head> 
<body> 

    <div class="container"> 
     <div class="row-fluid"> 
      <div style="background:gray" class="col-xs-12 col-sm-12 col-md-12"> 
       <h5 class="text-center">Title</h5> 
      </div> 
     </div> 

     <div class="row"> 
      <div style="background:green" class="col-xs-3 col-sm-3 col-md-3"> 
       <p>cell1cell1cell1cell1cell1cell1</p> 
      </div> 
      <div style="background:red" class="col-xs-3 col-sm-3 col-md-3"> 
       <p>cell2cell2cell2cell2cell2cel22</p> 
      </div> 
      <div style="background:blue" class="col-xs-6 col-sm-6 col-md-6"> 
       <p>cell3cell3cell3cell3cell3cell3</p> 
      </div> 
     </div> 

     <div class="row"> 
      <div style="background:gray" class="col-xs-12 col-sm-12 col-md-12"> 
       <button type="button" class="btn btn-default btn-sm pull-right"><i class="glyphicon glyphicon-remove"></i> Cancel</button> 
       <button type="button" class="btn btn-primary btn-sm pull-right"><i class="glyphicon glyphicon-ok"></i> Ok</button> 
      </div> 
     </div> 

    </div> 

</body> 
</html>

來源

2014-01-14 31415926

由於這些詞中沒有空格，因此這些詞不會顯示在2行中。它被視爲一個單詞。一個單詞永遠不會分成另一行。

在這些長詞之間使用一些空格。然後，他們將在2行顯示

希望這有助於你

來源

2014-01-14 16:11:32 wanderer

ü應有權使用

字斷：正常; 或 word-break：break-all;

來源

2014-01-15 09:00:41 tiyush

如何在bootstrap 3網格中獲得響應文本？

回答

相關問題