问答详情
源自:-

sass编译后的css选择器性能问题

scss代码:

header {
  padding: 20px;
  h1 {
    font-size: 24px;
    a {
      text-decoration: none;
      &:hover {
        text-decoration: underline;
        background: url(1.png) 0 0 no-repeat;
        span {
          color: @red;
        }
      }
    }
  }
  img {
    border: none;
    &.glow {
      border: @border;
    }
  }
}

编译后的css:

header {
padding:20px;
}
header h1 {
font-size:24px;
}
header h1 a {
text-decoration:none;
}
header h1 a:hover { 
text-decoration:underline;
background: url(1.png) 0 0 no-repeat;
}
header h1 a:hover span {
color: #f00;
}
header img {
border:none;
}
header img.glow { 
border:solid 1px #f00;
}


sass编译后的css选择器层次过多,对浏览器渲染速度是不利的,有没有解决的办法?

提问者:猿帅 2017-04-23 15:37

个回答