margin background_div盒子的外部距离(margin)【202】。

一、盒子的外部距离，在网页中主要是用来给盒子定位的。

因为盒子天生就在浏览器的左上角，所以本例我们设置的是盒子的顶部距离和左边距离来控制盒子的位置，具体用到了margin-top和margin-left。

图1

我这里是用vscode下做的，如下图：

图2

二、margin在样式里指的盒子的外部距离，分为四个方向，上下左右。

margin-top:10px;上距离
margin-left:10px;左距离
margin-right:10px;右距离
margin-bottom:10px;下距离

三、margin还可以简写，写法如下：

margin 10px;上下左右距离为10像素
margin 10px 20px;上下距离为10像素左右距离为20像素
margin 10px 20px 30px;上距离是10像素左右距离是20像素下距离是30像素
margin 10px 20px 30px 0px;上距离是10像素右距离是20像素下距离是30像素左距离是0像素

大家不要懵了，其实第4很好记，就是从上开始，顺时针依次到右，到下，到左。图2可以如下图简写：

图3

 Document

margin background_div盒子的外部距离(margin)【202】。相关推荐

11.前端笔记-CSS盒子模型-外边距margin
1.margin 1.1 margin的语法盒子与盒子之间的距离 <!DOCTYPE html> <html lang="en"> <head> ...
bootstrap4 调整元素之间距离 margin 和padding
响元素之间的间距是可以通过style的margin或padding属性来实现,但这两个属性本意并不相同:margin影响的是本元素与相邻外界元素之间的距离,这里简称外边距:padding影响的元素本身 ...
css margin padding 0,CSS 彻底理解margin与padding
我们在刚开始接触CSS的时候总是被margin和padding闹的晕头转向,什么时候设置margin,什么时候设置padding,不是太清楚,设置了以后在界面上看到的效果也差不多呀. 如何理解marg ...
css margin为什么重叠,CSS 外边距(margin)重叠及防止方法
边界重叠是指两个或多个盒子(可能相邻也可能嵌套)的相邻边界(其间没有任何非空内容.补白.边框)重合在一起而形成一个单一边界. 两个或多个块级盒子的垂直相邻边界会重合.结果的边界宽度是相邻边界宽度中最大 ...
html5中margin是什么意思,css中margin是什么意思，margin作用是什么？
一.介绍,什么意思? margin为对象外边距间隔属性.如果对一个对象比如div设置了边框后,再设置margin就会观察到这个div外面产生了间距边距. margin作用: 设置对象与其它对象的外边距 ...
C语言margin的作用是,css中margin是什么意思，margin作用是什么
一.简介,甚么含义? margin为对象外边距间隔属性.假如对一个对象比方div配置了边框后,再设置margin就会察看到这个div外面孕育发生了间距边距. margin感导: 设置对象与此外对象的外 ...
css margin属性,css margin属性怎么用？css margin属性用法教程
在css中,有一个重要的属性margin,很多人都不知道css margin属性是什么?怎么用,下面为您总结一下css margin属性用法教程. margin是css用于在一个声明中,对所有css ...
C语言margin的作用是,谈谈对margin的理解
1.margin是什么? margin用于控制元素周围空间的间隔,从视觉上达到空间间隔的目的.相对于前一个元素有相应的外边距.用于隔开元素与元素的.始终是透明的. 2.外边距的合并问题(参见w3sch ...
解决margin塌陷的问题_解决margin塌陷与margin合并（margin）清除浮动问题
**1.margin塌陷** 问题:垂直方向的父子关系的盒子使用不当会产生margin塌陷.给子级设置margin-top时,他不会相对父级一起动,只有他的margin超过父级的margin时,才会生 ...

margin background_div盒子的外部距离(margin)【202】。

margin background_div盒子的外部距离(margin)【202】。相关推荐

最新文章

热门文章