• CSS行内框(内联元素)


    行内框在一行中水平布置。可以使用水平内边距、边框和外边距调整它们的间距。但是,垂直内边距、边框和外边距不影响行内框的高度。由一行形成的水平框称为行框(Line Box),行框的高度总是足以容纳它包含的所有行内框。不过,设置行高可以增加这个框的高度。

    示例如下:

    <p>这是一个段落</p>
    <p><span>这是一个内联元素</span><span>这是第二个内联元素</span></p>

    设置样式如下:

    p{ margin:0;}

    显示如下:

     设置样式如下,可验证上述结论:

    p{
        margin:0px;
    }
    p span{
        /* 水平外边距可以调整行内框间距 */
        margin-left:50px;
        /* 水平内边距可调整行内框间距,垂直内边距不影响行内框的高度 */
        padding:20px;
        /* 垂直外边距不影响行内框的高度 */
        margin-top: 20px;
        /* 设置行内框的高度 */
        line-height: 50px; 
        /* 以下属性便于显示 */
        background-color: tomato;
        opacity: 0.8;
    }

    效果如图:

  • 相关阅读:
    iOS开发之--打印一堆奇怪东西的解决方案
    iOS开发之--从URL加载图片
    iOS开发之--搭建本地的SVN服务器
    HTML5
    swift
    swift
    HTML 换行
    HTML 注释
    HTML 水平线
    /etc/rc.d/rc.local
  • 原文地址:https://www.cnblogs.com/planetwithpig/p/11975835.html
Copyright © 2020-2023  润新知