首先说什么是盒子模型,可见元素在页面中会占据一个矩形区域,该区域就是元素的盒子。
内容和边框都是可见的,内容-内边距-边框,,,,,内边距-边框-外边距,这样有助于记忆。。
display 属性提供了一种改变元素类型的方式,这会改变元素在页面上的布局方式。
块级元素单独占一行,行内元素会和其他元素共占一行。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>display</title>
<style type="text/css">
p{
border: medium double black;
}
#kk{
border: medium double gray;
background-color: pink;
display: block; /*span 设置为块级元素*/
}
</style>
</head>
<body>
<p>
As the discribing of the fol picture, a man is meeting with an women, the women is soAs the discribing of the fol picture, a man is meeting with an women, the women is soAs the discribing of the fol picture, a man is meeting with an women, the women is soAs the discribing of the fol picture, a man is meeting with an<span id="kk"> women</span>, the women scribing of the fol picture, a man is meeting with an women, the women is soAs the discribing of the fos
</p>
<p> is soAs the discribing of the fol picture, a man is meeting with an women, the women is soAs the discribing of the fol picture, a man is meeting with an women, the women is
</p>
</body>
</html>
见文知意。
浮动 float
float: left; right none
定义了浮动的东西会挤在一起,所以需要清除浮动。clear: both;