- A+
前端3大结构:HTML内容结构,CSS样式美化,JS行为控制
CSS 外边距属性(Margin)
margin???????????????????? 在一个声明中设置所有外边距属性
margin:10px;?????????????? 上下左右外边距都为10px
margin:10px 20px;?????????????????? 上下外边距为10px 左右外边距20px(如果要设置左右居中值为auto)
margin:10px 20px 30px;???? 上外边距为10px 右外边距20px? 下外边距30px
margin:10px 20px 30px 40px;???????? 上外边距为10px 右外边距为20px? 下外边距30px 左外边距40px
margin-bottom????????????? 设置元素的下外边距
margin-left??????????????? 设置元素的左外边距
margin-right?????????????? 设置元素的右外边距
margin-top????????????????????????? 设置元素的上外边距
CSS 内外边距属性(Padding)
padding???????????????????????????? 在一个声明中设置所有的内边距属性
padding:10px;????????????? 上下左右内边距都为10px
padding:10px 20px;????????????????? 上下内边距为10px 左右内边距为20px
padding:10px 20px 30px;??? 上内边距为10px 左右内边距20px 下内边距30px
padding:10px 20px 30px 40px;??????? 上内边距为10px 有内边距20px 下外边距30px 左内边距40px
padding-bottom????????????????????? 设置元素的下内边距
padding-left?????????????? 设置元素的左内边距
padding-right????????????? 设置元素的右内边距
padding-top??????????????? 设置元素的上内边距
background
background-attachment??????????? 设置背景图片是否固定或者随着页面的其余部分滚动。scroll fixed inherit
background-color???????????????? 设置元素的背景颜色
background-image???????????????? 设置元素的背景图像
background-position????????????? 设置背景图像开始的位置。第一个水平 第二个垂直
background-repeat??????????????? 设置是否及如何重复背景图片。repeat no-repeat repear-x repear-y
background-size????????????????? 设置图片大小 可跟值一个或两个 第一个值水平 第二个值垂直(px,%,cover,contain)
display:block;/*变成块级元素*/
color:#999999;/*字体颜色*/
font-family:宋体,sans-serif;/*字体样式*/
font-size:9px;/*字体大小*/
font-style:itelic;/*字体斜体*/
font-variant设置小型大写字母的字体显示文本small-caps;/*小字体*/
letter-spacing:1pt;/*字间距离*/
text-decoration:none;/*去超链接下划线*/
font-weight:bold;/*字体加粗*/
text-align:center;/*文字水平方向*/
line-height:50px;/*行高*/
border-radius:3px;/*CSS3圆角*/
border:3px solid #000;/*粗细 样式 颜色*/
*{margin:0px;padding:0px;}/*通配符 1.清除所有元素默认内外边距样式之间不同浏览器的兼容问题*/
position:relative;/*相对位置 参照物*/
position:absolute;/*绝对定位 改变盒子位置*/
list-style:none;/*去掉默认的列表样式,列表前面的小圆点*/