我有默认的 Bootstrap 变量,它们工作正常,但我有:
@media (max-width: @screen-xs-min) {
}
如何在 @screen-xs-min
和 @screen-sm-min
之间设置变量?
最佳答案
@media(最小宽度:@screen-xs-min)和(最大宽度:@screen-sm-min){
...CSS代码在这里
}
虽然作为一般规则,最好只对 Bootstrap 中的大部分 CSS 使用 max-width,这样您的样式规则就可以向下层叠用于较小的设备。所以,你可以使用:
@media(最大宽度:@screen-sm-min){
...CSS代码在这里
}
对于平板电脑,当您发现某些元素在手机上看起来不正确时,可以通过以下方式覆盖这些平板电脑规则:
@media(最大宽度:@screen-xs-min){
...CSS代码在这里
}
也就是说,我经常发现需要同时使用 max-width 和 min-width 进行小的调整,一旦我将响应式布局放在一起,通常是一两个样式规则。
关于css - 值之间的 Less 和 Bootstrap 变量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24816136/