css要点补充，项目演练
淘宝的页面两边有留白，当缩小浏览器窗口时，中间的内容不会缩小，而是两边的留白在缩小？
在内容部分加上margin，上下是0，左右自适应。
<html>
<head>
<meta charset="UTF-8">
<title>lesson9</title>
<link rel="stylesheet" href="css/lesson9.css">
</head>
<body>
<div class="wrapper">
<div class="content"></div>
</div>
</body>
</html>
*{
margin: 0;
padding: 0;
}
.wrapper{
height: 30px;
background-color: #123;
}
.content{
/* 外边距，上下是0，左右自适应 */
margin: 0 auto;
width: 800px;
height: 30px;
background-color: hotpink;
}
display属性有三种元素：inline, block, inline-block
inline inline-block --> 文本类元素
凡是带有inline属性的元素都有文本属性，所有它叫文本类元素。
我们的两个文本之间，无论加多少个空格，显示出来的都只有一个空格。span是一个文本类元素，两个span之间无论加多少个空格，显示出来的也只有一个空格。
img是inline-block，是文本类元素，能被文字分隔符分割。四个img标签之间的换行符是文字分隔符，所以在本机显示的四张图中间会有一个空格。但是一旦html代码上传到服务器，服务器会将html代码中的空白字符都去掉，所以四个img标签之间就没有换行符了，所以在服务器上展示的效果是四个图片能正常合并在一起。
<html>
<head>
<meta charset="UTF-8">
<title>lesson9</title>
<link rel=
最低0.47元/天 解锁文章
6461
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
