三道杠问题,求解

来源:12-10 我想脚下踩条线 - 使用border为盒子添加边框(二)

YIFAN111

2017-09-17 21:10

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>三道杠图标</title>
<style type="text/css">
.line-tri{
    width:150px;
    height:30px;
    padding:15px 0;
    border-top:30px solid;
    border-bottom:30px solid;
    background-color:currentColor;
    background-clip:content-box;

}
</style>
</head>
<body>
<div class="line-tri"></div>
</body>
</html>

为什么容器的高度为30px呢,padding值相加都达到30px了,不懂。。。还有边框不是应该包括在容器里呢吗?求解惑。。。。

写回答 关注

1回答

  • AEEYOUAGAIN
    2017-09-17 22:05:42

    您好,CSS 里定义的宽高,是填充内容的宽高,其他的加起来的总和才是盒子模型的总宽高。请注意定义的准确性。详情可以查看HTML-CSS基础课程,11-8盒子模型,宽度和高度。

    YIFAN1...

    好的,谢谢,之前学过的忘掉了

    2017-09-18 09:14:34

    共 1 条回复 >

初识HTML(5)+CSS(3)-升级版

HTML(5)+CSS(3)基础教程8小时带领大家步步深入学习标签用法和意义

1225297 学习 · 18230 问题

查看课程

相似问题