<!DOCTYPE html>
<html>
<head>
<style>
div { display: flex;
gap: 20px;
}
div.box { width: 100px;
height: 100px;
background: beige;
padding: 5px;
}
div.box2 { height: round(up, 105px, 25px);
}
div.box3 { height: round(down, 120px, 25px);
}
div.box4 { height: round(to-zero, 115px, 25px);
}
</style>
</head>
<body>
<h1>round() 函数</h1>
<p>在这里,round() 函数用于设置最后四个 div 的高度。每个 div 的高度值在 100px 到 125px 之间,且四舍五入的间隔均为 25px。因此,下方盒子的高度要么向上舍入为 125px,要么向下舍入为 100px。</p>
<p>第一个 div 的高度为 100px。</p>
<div>
<div class="box">height: 100px</div>
<div class="box box2">向上舍入 105px(高度将为 125px)</div>
<div class="box box3">向下舍入 120px(高度将为 100px)</div>
<div class="box box4">向零舍入 115px(高度将为 100px)</div>
</div>
</body>
</html>