1, 去除 div 内部间距和外部间距
- div{
- margin: 0;
- padding: 0;
- }
2, 去除 div 之间的间距
默认情况下, div 之间是没有间距的, 如果设置了 display: inline-block, 则会出现间距.(推荐学习: CSS 视频教程 https://www.html.cn/css/ )
- <!DOCTYPE HTML>
- <HTML>
- <head>
- <meta charset="UTF-8">
- <title>
- Document
- </title>
- <style>
- div{ display: inline-block; border: 1px solid #000; }
- </style>
- </head>
- <body>
- <div>
- 1
- </div>
- <div>
- 2
- </div>
- <div>
- 3
- </div>
- </body>
- </HTML>
效果:
原因, 写代码时, 换行缩进造成的出现空格.
解决方法:
设置父级元素 font-size 为 0, 再重新设置 div 的 font-size 即可
- body{
- font-size: 0;
- }
- div{
- font-size: 16px;
- }
来源: http://www.css88.com/qa/css3/15553.html