Pertanyaan CSS tidak ada bungkus teks


Silakan lihat kode http://jsbin.com/eveqe3/edit, juga dikutip di bawah ini.

Saya harus menunjukkan teks di dalam div item sedemikian rupa sehingga teks hanya muncul di kotak hijau dengan lebar baris yang ditentukan harus disembunyikan. Ada saran silahkan ...

<style>
  #container{
    width : 220px;
  }
  .item{
    float:left;
    border: 1px solid #0a0;
    width: 100px;
    height: 12px;
    padding 2px;
    margin: 0px 2px;
  }
  .clearfix{
    clear: both;
  }
</style>
</head>
<body>
  <div id="container">
    <div class="item"> A very loooooooooooooooooooooong text </div>
    <div class="item"> Another looooooooooooooooooooong text </div>
    <div class="clearfix">  </div>
   </div>
</body>
</html>​

42
2017-07-22 11:35


asal


Jawaban:


Selain meluap: disembunyikan, gunakan

white-space:nowrap;

113
2017-07-22 11:46



Cukup gunakan:

overflow: hidden;
white-space: nowrap;

Di div item Anda


15
2017-07-22 11:37



Gunakan luapan properti css. Sebagai contoh:

  .item{
    width : 100px;
    overflow:hidden;
  }

Properti luapan dapat memiliki salah satu dari banyak nilai seperti ( tersembunyi , gulir , terlihat ) .. Anda dapat mengontrol limpahan dalam satu arah hanya menggunakan overflow-x atau overflow-y.

Saya ho


2
2017-07-22 11:38