第四天：CSS的元素显示模式

鳕鱼&羚羊

于 2021-09-19 14:51:56 发布

阅读量101

点赞数 1

分类专栏： web前端学习之路文章标签： css html5 html

本文链接：https://blog.csdn.net/Y1_1Y1_1y1_1y/article/details/120380362

版权

本文详细介绍了CSS中的元素显示模式，包括块级元素、行内元素和行内块元素的特点及使用注意事项，如块级元素占据整行，行内元素的宽度受内容限制，行内块元素则结合了两者特性。还提到了元素显示模式的转换技巧。

摘要由CSDN通过智能技术生成

1、块级元素
a.独占一行
b.高，宽，内外边距可以控制
c.宽度默认是容器（父级宽度）的100%
d.是一个容器及盒子，里面可以放行内或块级元素
注意事项：
1.文字类的元素内不能使用块级元素
2.<p>标签主要用于存放文字，因此<p>里面不能放块级元素，特别是不能放<div>
3.同理，<h1>~<h6>等都是文字类块级标签，里面也不能放其他块级元素


    <title>块级元素</title>
    <style>
        div {
     
            width: 200px;
            height: 300px;
            background-color: blueviolet;
        }
    </style>
</head>

<body>
    <div>你好世界</div>
    <p>
        <div>你好世界</div>
    </p>
</body>