适用于大型元素类的Bootstrap 3.0响应式CSS

时间:2013-09-08 13:22:06

标签: html css twitter-bootstrap twitter-bootstrap-3

我希望所有输入和按钮元素显示为<的正常大小。 767px屏幕。如果是> 767px屏幕虽然我需要.btn-lg和.input-lg类应用于所有按钮和输入。这样可以在更大的屏幕上实现更轻松的触摸体验。如何才能做到这一点?它可以用纯CSS吗?

完成

2 个答案:

答案 0 :(得分:1)

您可以使用媒体查询

@media screen and (max-width:767px){
//all the styles for btns within 767px
}
@media screen and (min-width:767px){
//all styles above 767px
}

您也可以使用jquery实现此目的:

if($(window).outerHeight(true) <  767){
   //add class to your btns and lists and remove classes...
}

这是一种方法,有许多方法。

答案 1 :(得分:0)

当然可以用纯CSS完成。

请检查“响应式实用程序类”

此处:bootstrap scaffolding

您还可能需要http://www.w3.org/TR/css3-mediaqueries/ - 媒体查询