块级元素与行内元素
<!DOCTYPE html>
<html lang="en">
<!--css3选择器-->
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
h1{
background-color: pink;
}
span{
background-color: red;
}
/*设置display:inline 属性则块级元素会转为行内元素*/
div{
display: inline;
background-color: red;
width: 200px;
height: 200px;
}
</style>
</head>
<body>
<div>
<!--块级元素
1. 霸占一行，不能与其他元素并列
2. 能接受宽、高
3. 如果不设置宽度，则默认为父亲标签的100%-->
<!--容器级 div h系列 li dt dd;
容器级为块级元素-->
<!--设置display:inline 属性则块级元素会转为行内元素-->
<h1>哈哈</h1>
<h1>嘻嘻</h1>
<!--行内元素
1. 与其他行内元素并排
2. 不能设置宽高，默认的宽高即为文字的宽度-->
<!--文本级 p span a；
文本级为行内元素，p是文本级但是是块级元素-->
<!--设置display:block 属性则行内元素会转为块级元素-->
<span>哈哈</span>
<span>嘻嘻</span>
</div>
<div>
我是个div
</div>
<div>我是div</div>
</body>
</html>
3941
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
