CSS基础

(1)margin

1.margin:1px [2px] [3px [4px]];

四个宽度分别代表:上外边距,右外边距,下外边距,左外边距

指定三个和四个,从前往后一次上,右,下,左

指定两个,第一个代表上下,第二个代表右左

2.margin:auto

由浏览器自动计算外边距

.main {
margin:auto;//实现水平居中;
position:relative;
margin-top:10%;//覆盖margin=auto 定义的 margin-top:auto
border-style:dashed;
border-color:red;
border-3px;
height:300px;
800px;
}

3.margin-top,margin-left,margin-bottom为负数

在css盒子模型中,border,padding,height,width均不能为负值,margin为负值时,元素将相对于原来位置向指定方向移动一定距离之后布局

 

(2) border

1.border: 5px solid red;

四个边框的样式均为5px ,border-style:solid,border-color:red

2.可单独定义指定边的border属性:border-[bottom,right,top,left]-[style,width,color]

3.border-style

dotted,dashed,solid,double,outset,hidden,none

border-style:dashed,solid,double,outset 分别指定上,右,下,左边框style

4.border-radius:3px

 

(3)padding

1.padding:1px [2px] [3px [4px]];

四个宽度分别代表:上内边距,右内边距,下内边距,左内边距

指定三个和四个,从前往后一次上,右,下,左

指定两个,第一个代表上下,第二个代表右左

2.padding:auto css中auto不是padding的一个合法值

3.可用padding-left,padding-right,padding-bottom,padding-top 单独制定对应边的内边距

原文地址:https://www.cnblogs.com/wzcblogs/p/6113711.html