Rumah > Artikel > hujung hadapan web > css box-lines属性怎么用
css box-lines属性怎么用
- 藏色散人asal
- 2019-05-29 14:28:473406semak imbas
css box-lines属性用于规定如果列超出了父框中的空间，是否要换行显示，其语法是box-lines: single|multiple。
css box-lines属性怎么用？
作用：规定如果列超出了父框中的空间，是否要换行显示。
语法：
box-lines: single|multiple;
说明：single所有子元素会被放置在单独的行或列中。（无法匹配的元素会被视为溢出）。multiple允许框扩展为多行，以容纳其所有子元素。
注释：默认地，水平框会在单独的行中排列其子元素，而垂直框会在单独的列中排列其子元素。
css box-lines属性使用示例
<!DOCTYPE html>
<html>
<head>
<style>
.container
{
width:300px;
border:1px dotted black;
/* Firefox */
display:-moz-box;
-moz-box-orient:horizontal;
-moz-box-lines:multiple;
/* Safari and Chrome */
display:-webkit-box;
-webkit-box-orient:horizontal;
-webkit-box-lines:multiple;
.box
{
width:100px;
/* Firefox */
-moz-box-flex: 1.0;
/* Safari and Chrome */
-webkit-box-flex: 1.0;
/* W3C */
box-flex: 1.0;
}
</style>
</head>
<body>
<div class="container">
<div class="box">11111111111</div>
<div class="box">22222222222</div>
<div class="box">33333333333</div>
<div class="box">44444444444</div>
</div>
<p><b>注释：</b>目前没有浏览器支持 box-lines 属性。</p>
</body>
</html>效果输出：
Atas ialah kandungan terperinci css box-lines属性怎么用. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：css box-flex-group属性怎么用Artikel seterusnya：css overflow-y属性怎么用