CSS入门四、浮动
1、元素显示模式
（1）元素显示模式是什么
学习元素显示模式的主要目的就是分清它们各自的特点，网页布局的时候，在合适的地方用合适的显示模式。
元素显示模式就是元素（标签）以什么方式进行显示，比如<div>自己占一行，比如一行可以放多个<span>。
HTML 元素一般分为块元素和行内元素两种类型。
（2）块元素
常见的块元素有<h1>~<h6>、<p>、<div>、<ul>、<ol>、<li>等，其中 <div> 标签是最典型的块元素。
块级元素的特点：
自己独占一行。
高度，宽度、外边距以及内边距都可以控制，即使设置宽度不足一行，但是还是独占一行。
宽度默认是容器（父级宽度）的100%。
是一个容器及盒子，里面可以放行内或者块级元素。
块级元素的注意事项：
文字类的元素内不能使用块级元素。
<p> 标签主要用于存放文字，里面不能放块级元素，特别是不能放<div>。
<h1>~<h6>等都是文字类块级标签，里面也不能放其他块级元素。
案例如下：
<!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>显示模式之块级元素</title>
<style>
div {
/* width: 200px; */
height: 200px;
background-color: pink;
}
</style>
</head>
<body>
<div>比较霸道,自己独占一行</div> 瑟瑟发抖
<p>
<div>这里有问题</div>
</p>
</body>
</html>
1420
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
