由于公司人员配置的原因，不得已要自己制作页面了。对于大多数后端技术员来讲，自己写前端页面是件很痛苦的事情，但是没办法，只能是硬着头皮上了，虽然之

前也有接触一些css，除了css3的一些属性，其他的基本都知道，并了解使用，可从始至终除了拼凑一些后台页面以外，就没有真正完整的做过几个前端页面。

     然后就着我所知道的那些标签跟css属性写起了页面。首先，我所知道的div+css布局：

1.    页面的左边跟右边要留白，不然分辨率一变，页面就没用了（定宽），我写的是1200px作为可视区。

2.    页面内容左右要居中，我只知道一个text-align=center,  和absolute+ margin 50%+偏移,  没有了

3.    上下居中，记得有一个vertical-align=middle,这个死活不知道怎么用，写上去没效果，还有一个就是自己摸索出来的 内层line-height +外层定高可以实现基本的标

       题 跟div上下居中,div只能是通过设置内层margin或者外层padding实现了

4.    多个div左右排布 ，float 

5.    li 左右排布  li 设置float left or right , list-style=none 去掉li前面那些点点  

6.    遮盖层，外面由两个div组成，一个做那个下面的遮盖层(带透明的，调opacity就好)，还一个是要显示的内容，这里用position=absolute + z-index控制div的显示位

       置和底层表层

7.   关于position=absolute，如果次外层没有position=relative的情况下，写这个都是相对于整个窗口而言，如果有的话就是相对于次外层 而言，top left right bottom

      等控制位置就好

8.   字体颜色用 color控制，背景颜色用background-color:red（#ff0303）,背景图background-image:url(路径);

9.   图片做超链接，把<img>套在<a>里面，想把<a>做到图的某个位置上的时候，就把<img>所在的容器设上position:relative,<a>设置position:absolute,调下top left ……

      就好了

10. 另外对于上下左右居中，我网上查了下有个很好的方式flex,不过这种IE9就给挂了，所以没去用

11. 关于div的高度，使用我这种布局的，padding也算里面，例如外层div 想让它高度为100px，然后设置了padding:20px ，那么它的height就只能设为80px了，不然就

      变成了120px了

12. 再分享几个东西，http://www.spritecow.com/（雪碧图）和 切图神器 pxcook(像素大厨)想再插个链接，插不上去，编辑html也不行,真正要做页面的时候肯定可以用

      得上的

小弟才疏学浅，前端大神看到不要喷，你不会了解后端技术员做前端页面的痛

自己写前端页面