css垂直居中的实现

  • 平时写代码遵守的编码规范

HTML页面第一行添加Doctype声明，能够确保在每个浏览器中都有一只的展现
添加语言属性，才更有利于翻译工具在进行翻译时遵循其规定等等。

 * 1. html {        //选择器和花括号之间和空格分隔。
        }
    2. 全部采用小写
    3. 命名时 简略/明了/符合语义
    4. 标签语义化
    5. HTML结构清晰/ 简单/不要过度复杂，嵌套太多层/
    6. 尽量遵循HTML标准和语义，但是不要以牺牲实用性为代价。
   [参考链接 BootStrap编码规范](http://codeguide.bootcss.com/)
  • 垂直居中的实现方式

  • 绝对定位


    qq 20170505094009

  • 设置display为内联块(inline-block)，通过vertical-align: middle 垂直居中


    qq 20170505094438

  • 设置上下内边距相等


    qq 20170505094537
  • 设置display: table-cell
qq 20170505094708

  • 设置line-height


    qq 20170505095513
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容