line-height

最新推荐文章于 2022-07-07 00:52:44 发布

weixin_30456039

最新推荐文章于 2022-07-07 00:52:44 发布

阅读量53

点赞数

原文链接：http://www.cnblogs.com/monstermr/p/10596754.html

版权

应将line-height作为盒模型内容基准

行内子元素的line-height会撑开父元素的line-height

撑开后将父元素撑开的元素居内容区中间，其他行内元素与其底对齐（不包含其他撑开内容区的元素比如下面代码中的浮动元素就会继续将内容区撑开）

行内元素浮动后会转变为块状元素

行内元素无法像块元素一样添加基于盒模型的属性比如margin pardding

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
    .main{
        background:gray;
        line-height: 30px;
        font-size:20px;
        overflow:hidden
    }
    .a{
        border: 1px solid red;
        line-height: 50px;
        font-size: 10px;
        margin-top: 10px;
        float:right;
        background: yellow;
    } 
    .b{
        background:blue;
        line-height: 80px;
        font-size: 10px
    }
    </style>
</head>

<body>
    <div class="main">
        <span class="a">标签a</span>
        <!-- <br clear="right">   -->
        <span class="b">标签天赋建议是南方沙发加上方法的加减法i是否送i的飞机萨芬就</span>
        你好啊世界标签天赋建议是南方沙发加上方法的加减法i是否送i的飞机萨芬就标签天赋建议是南方沙发加上方法的加减法i是否送i的飞机萨芬就
    </div>
</body>
</html>

转载于:https://www.cnblogs.com/monstermr/p/10596754.html

weixin_30456039

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
line-height

应将line-height作为盒模型内容基准行内子元素的line-height会撑开父元素的line-height撑开后将父元素撑开的元素居内容区中间，其他行内元素与其底对齐（不包含其他撑开内容区的元素比如下面代码中的浮动元素就会继续将内容区撑开）行内元素浮动后会转变为块状元素行内元素无法像块元素一样添加基于盒模型的属性比如margin pardding<!DOCT...
复制链接

扫一扫