也可以连写，margin的四个值，对应上面的顺序，不加可以写0，值可以是具体像素数值也可以是百分比。也可以两个值，分别是上下和左右。也可以是三个值，方位对应上，左右，下。
值得注意的是，上下两个盒子的边距会重叠，值取大的那个边距。
1、首先新建一个html文件，命名为test.html，在test.html文件内，使用p标签创建一行文字，文字内容为“这是一段测试的文字”。
2、然后在test.html文件内，设置p标签的class属性为txt，主要用于下面通过该class来设置css样式。
3、接着在test.html文件内，编写<style type="text/css"></style>标签，页面的css样式将写在该标签内。
4、在test.html文件内，在css标签内，以“.类名”的形式来设置p标签的样式。
5、在css标签内，使用letter-spacing属性设置文字的间距，间距值的单位可以是px，rem，cm等css单位。例如，这时设置文字间隔为20px。
6、最后在浏览器打开test.html文件，查看实现的效果，如下图所示就完成了。
html调整添加的图片与文本之间的距离方法：
工具/原料
Dreamweaver
方法/步骤
1、打开Dreamweaver，之后，新建一个html文档，然后在界面的上方找到插入图片的按钮，点击它，插入图片。
2、插入图片之后，再写上文字，文字在图片下方，和图片的距离比较远，这是默认的距离，不会调的话，怎么调都是这么宽的。
3、切换到代码模式，或者拆分模式，拆分模式的好处就是可以同时看到代码和实际效果。
4、将图片和文字对应的所有P版权都删除，包括<p>和</p>，这些标签是段落标签，dw默认段间距太宽，所以我们就换一种段落方式。
5、删掉了p标签之后，在文字的前端写上<br>,然后看一下效果，图片和文字的距离缩小了，效果如图所示。
6、对于图片文字环绕效果，是在文字比较多的时候才会用到，由于新版dw的属性面板没有图片环绕方式的选项，只能从其它途径来修改了。
7、首先右击图片，然后选择对齐，这里有很多种对齐方式，常用的有左对齐和右对齐，左对齐就是图片在左边，文字在右边，右对齐就是文字在左边，图片在右边。这两种都是图片和文字的环绕效果。
8、就选择的是左对齐，效果如图中所示。是不是环绕的很整齐，在网页排版文字时经常需要用到。
