Board logo

标题: CSS综合 [打印本页]

作者: look_w    时间: 2019-2-19 17:15     标题: CSS综合

说一说你平时写代码遵守的编码规范
1. 语义化

    语义化标签优先
    基于功能命名、基于内容命名、基于表现命名
    简略、明了、无后患

2. CSS规范

    tab 用两个空格表示
    css的 :后加个空格, {前加个空格
    每条声明后都加上分号
    换行,而不是放到一行
    颜色用小写,用缩写, #fff
    小数不用写前缀, 0.5s -> .5s;0不用加单位
    尽量缩写, margin: 5px 10px 5px 10px -> margin: 5px 10px
    相关的属性声明应当归为一组,并按照positioning,Box model,Typographic,visual顺序

垂直居中有几种实现方式,给出代码范例

    设置上下padding相等

    .ct {
      padding: 40px 0;
      text-align: center;
      background: #eee;
    }

    绝对定位实现垂直居中

    .dialog {
      position: absolute;
      left: 50%;
      top: 50%;
      margin-left: -200px;
      margin-top: -150px; /*transform: translate(-50%,-50%);*/
      width: 400px;
      height: 300px;
      box-shadow: 0px 0px 3px #000;
    }

    vertical-align实现居中
    JS bin
    table-cell实现居中

    .box{
      width:500px;
      height: 300px;
      border: 1px solid;
      display: table-cell;
      vertical-align: middle;
      text-align: center;
      
    }




欢迎光临 电子技术论坛_中国专业的电子工程师学习交流社区-中电网技术论坛 (http://bbs.eccn.com/) Powered by Discuz! 7.0.0