css - 關于label span組成的展示表格,如何控制它的寬度
問題描述
在這樣一個結構中,如何讓該行數據,當某個span文字太長時,能自動換行,然后在小屏及大屏4個項能平均分配寬度,自適應那樣呢 ?應該如何用樣式控制比較好?求救!謝謝
問題解答
回答1:是要這個效果嗎?
寬度變化也沒問題
html:
<p class='line_block'> <p class='line_data'><p class='xxx'> <label>項目名稱:</label> <span class='w-130'>測試信息學校信息尋尋</span></p> </p> <p class='line_data'><p class='xxx'> <label>項目名稱:</label> <span class='w-130'>測試信息學校信息尋尋</span></p> </p> <p class='line_data'><p class='xxx'> <label>項目名稱:</label> <span class='w-130'>測試信息學校信息尋尋</span></p> </p> <p class='line_data'><p class='xxx'> <label>項目名稱:</label> <span class='w-130'>測試信息學校信息尋尋</span></p> </p></p>
css:
.line_block{ width: 100%; font-size: 0;}.line_data{ display: inline-block; vertical-align: top; width: 25%; font-size: 14px;}.xxx{ padding: 10px;}
多加了一個p用來加個padding,要不都擠在一起不好看,可以去掉。
