关于行高的疑惑

来源:3-4 企业网站制作之导航部分制作(一)

海南椰子树

2015-02-18 11:40

看代码:

<html>

<meta http-equiv='content-type' content='text/html charset=utf-8'>

<head>

<title>测试行高</title>

<style type="text/css">

*{

margin:0px;

padding:0px;

border:0px;

}

.a{

height: 80px;

}

.b{

font-size: 20px;

}

.c{

font-size: 15px;

}

.d{

line-height: 80px;

}

</style>

</head>

<body>

<div class='a'>

<div class='d'>

<span class='b'>大字</span><span class='c'>小字</span>

</div>

</div>

</body>

</html>

经测试,a的高度为80像素,d的高度为82像素。为何啊?这样使得在a框下面的内容被加下去了两个像素

写回答 关注

1回答

  • 阿龙丶
    2015-12-19 10:49:25

    看一下css深入理解之line-height吧

    http://www.imooc.com/learn/403

企业网站综合布局实战

本课程重点介绍HTML/CSS实现常见企业网站布局的方法

157043 学习 · 1984 问题

查看课程

相似问题