css - 關于label span組成的展示表格，如何控制它的寬度

問題描述

在這樣一個結構中，如何讓該行數據，當某個span文字太長時，能自動換行，然后在小屏及大屏4個項能平均分配寬度，自適應那樣呢 ？應該如何用樣式控制比較好？求救！謝謝

問題解答

是要這個效果嗎？

寬度變化也沒問題

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，要不都擠在一起不好看，可以去掉。