CSS-样式

background-size:cover; //等比放大背景图片
background-size:contain; //等比缩小背景图片
-webkit-border-radius: 15px;//圆角

box-shadow: 0px 0px 30px 5px rgba(0, 0, 0, .08);

*｛margin:0;padding:0｝//所有标签样式的内外边距皆为0
margin: 0px auto;//div居中
<div align="center"></div>//div内容居中
border-collapse: collapse;//表格无间隙
border-spacing: 24px;//td之间的间距
letter-spacing: 3px;//字间距

<!--    图片居中，自缩放 自适应(?)    -->
<div id="headImg">
</div>
#headImg {
    height: 300px;
    background-image: url(images/bg.jpg);/*版头图片*/
    background-origin: content-box;/*背景图相对于XX来定位 content-box(背景图相对于内容框来定位)padding-box(背景图相对于内边距框来定位)border-box(背景图相对于边框盒来定位)*/
    background-size: contain;/*保持图片本身的宽高比，将图片缩放为真高适应定义背景区域*/
    background-repeat: no-repeat;/*图片不重复显示*/
    background-position: 50% 50%;/*图片上下左右居中*/
}

方法1: span{ width:100px; height:20px; line-height:20px; text-align:center; float:left;}
方法2: span{ width:100px; height:20px; line-height:20px; text-align:center; display:block;}
方法3: span{ float:left; padding:5px 20px;}

方法1和方法2都在处理span标签显示方式,span标签默认是行内元素,如果给它设置了float或dispaly:block属性就能让它转为块级元素,line-height设置行高,设置它后文字会垂直居中,text-align:center设置文字水平居中,这样达到自己的需求
方法3利用内边距进行设置,padding:5px 20px(完整写法:padding:5px 20px 5px 20px;) 设置了上右下左各个参数,如果上下,左右参数相同就可以简写,例如:div宽高分别为:100px 20px; 设置span最大不能超过父级div,其中span的宽为:字体长度加上左右padding值,高同理