我想使用Modernizr类,但我无法在当前的嵌套选择器中看到如何使用SASS正确地完成它。
如何优化:
.page-home
.content
.rows
.row
background: blue
.images
width: auto
html.no-touch
.page-home
.content
.rows
.row
&:hover
background: red
html.touch
.page-home
.content
.images
max-width: 50px
渲染类似:
.page-home .content .rows .row {
background: blue;
}
html.no-touch .page-home .content .rows .row:hover {
background: blue;
}
.page-home .content .images {
width: auto;
}
html.touch .page-home .content .images {
max-width: 50px;
}
答案 0 :(得分:3)
.page-home
.content
.rows
.row
background: blue
html.no-touch &:hover
background: red
.images
width: auto
html.touch &
max-width: 50px
将呈现:
.page-home .content .rows .row {
background: blue; }
html.no-touch .page-home .content .rows .row:hover {
background: red; }
.page-home .content .images {
width: auto; }
html.touch .page-home .content .images {
max-width: 50px; }