• CSS的显示模式


    div与span

    div与span有什么区别
    div单独占一行,span不会单独占一行
    div是容器级的标签,而span是一个文本级的标签
    容器级的标签有:div , h , ul , ol , dl , li ...
    文本级的标签有:span , p , buis , del , em , ins ...
    容器级的标签中可以嵌套其它所有标签
    文本级的标签中只能嵌套文字/图片/超链接

    CSS显示模式

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="utf-8">
    <title>HTML5+CSS3</title>
    <style>
        * {
            margin:0;
            padding:0;
            font-family: "Microsoft YaHei";
        }
        div {
            display:inline;
        }
        span {
            display:block;
            background:green;
            100px;
            height:100px;
        }
        .cc {
            background:blue;
            200px;
            height:200px;
            display:inline-block;
        }
    </style>
    </head>
    <body>
    <!--
    在HTML中所有的标签分为两类:容器级与文本级
    在CSS中将所有标签分为两类:块级元素与行内元素
    1:什么是块级元素,什么是行内元素?
        块级元素独占一行:div , h , ul , ol , dl , li , dt , dd , p
        块级元素如果没有设置宽度就和父级元素一样宽;如果设置了宽高就和设置的一样宽高
        行内元素不会独占一行:span , buis , strong , em , ins , del
        行内元素如果没有设置宽度默认就和内容一样宽
        行内元素是不可以设置宽度和高度的
    2:行内块级元素
        为了能够让元素既能够不独占一行,又可以设置宽度和高度,就出现了行内块级元素
    3:显示模式的互相转换
        设置元素的display属性:block 块级, inline 行内, inline-block 行内块级
    -->
    <div>这是DIV</div>
    <div>这是DIV</div>
    <span>这是SPAN</span>
    <span>这是SPAN</span>
    <p class="cc">这是P</p>
    <b class="cc">这是B</b>
    </body>
    </html>
    

      

  • 相关阅读:
    字符串里输出字符c的所有位置
    python时间戳
    python之set()和issubset()方法
    python之判断键是否存在于字典中
    python之方法与函数的区别,及其传参
    接口测试之requests
    python之isinstance()函数
    MySQL创建表时,被``和''坑了很久
    游标位置self.cur.scroll(0, mode='absolute')
    python操作MySQL数据库
  • 原文地址:https://www.cnblogs.com/ginvip/p/7899203.html
Copyright © 2020-2023  润新知