波旁威士忌/萨斯威士忌:#{$all-文本输入}，悬停或焦点

Question

根据波旁威士忌文档，您可以使用 #{$all-text-inputs}把这个变成：

#{$all-text-inputs} {
  border: 1px solid green;
}

进入这个：

input[type="email"], input[type="number"],   input[type="password"], input[type="search"],
input[type="tel"],   input[type="text"],     input[type="url"],      input[type="color"],
input[type="date"],  input[type="datetime"], input[type="datetime-local"],
input[type="month"], input[type="time"],     input[type="week"] {
  border: 1px solid green;
}

波旁威士忌或萨斯有没有办法将:hover或:focus应用于每个人？

#{$all-text-inputs:hover}和#{$all-text-inputs}:hover不起作用。

Answer 1

您应该

能够使用 Sass 父选择器嵌套:hover和:focus样式：

#{$all-text-inputs} {
  border: 1px solid green;
  &:hover, &:focus {
    // some styles
  }
}

Answer 2

#{$all-text-inputs-hover}而不是#{$all-text-inputs:hover}怎么样？

对于焦点#{$all-text-inputs-focus}

再看一遍规格http://bourbon.io/docs/#html5-input-types