当 margin 为 margin:10px 时,表示 top,right,bottom,left (逆时针)方向都是10px;
当 margin 为 margin:10px 20px 时,表示上下方向为10px,左右方向为20px;
当 margin 为 margin:10px 20px 5px 时,表示top方向为10px,左右方向为20px,bottom方向为5px;
当 margin 为 margin:1px 2px 3px 4px 时,表示top方向为1px,right方向为2px,bottom方向为3px,left方向为4px。
margin | 含义 |
10px | 上下左右 |
10px 20px | 上下10 左右20 |
10px 20px 30px | 上10 左右20 下30 |
10px 20px 30px 40px | 上 下 左 右 |
div位置控制
<div class="backGround_star">
.backGround_star {
width: 100%;
height: 100%;
opacity: 1;
background: url(../../assets/image/backGround_star.png) no-repeat center;
background-size: 30% 30%;
background-position: 10% 90%;
}
说明:
background-position:30%70%;的设置,使得背景图片的中心点在水平方向上处于30%的位置,在竖直方向上则位于70%的位置。 此时,如果改变了浏览器窗口的大小,背景图片也会进行相应的调整,但是,始终位于水平方向上30%和竖直方向上70%的位置。
背景图片设置
同上
相对定位与绝对定位
绝对定位:相对于屏幕左上角,不受父亲容器的影响
position: absolute;
How to display HTML5 Video Tag in Circle shape?
蓝色下划线鼠标移动上去显示手势
.loginButton {
color: rgb(89, 133, 232);
font-size: 24px;
font-family: "MicrosoftYaHei Regular";
text-decoration: underline;
cursor: pointer;
}