Question

我正在尝试使用类似boostrap框架的东西，根据窗口大小有选择地选择要应用于给定元素的css类。

例如，在bootstrap中，有没有办法根据浏览器中的xs，sm，md和lg分区选择要应用的类属于什么？

有没有简单的方法可以做到这一点？我需要使用javascript吗？我应该看看除了引导程序以外的东西吗？

Answer 1

听起来你需要media query。

它们允许您根据窗口大小选择性地应用样式。

例如：

@media all and (max-width: 1000px) {
  .element {
     color: blue;
  }
}

如果屏幕尺寸宽度低于element，上述内容会对任何html标记的文本应用蓝色，该标记的类别为1000px。

Answer 2

你可以使用css媒体查询或使用像

这样的javascript

   $(document).ready(function() {

    var hei = $(window).height();
    var wid = $(window).width();
    if (hei <= 640 || wid <= 360) {
      $('element').css('property','value');
    }
    });

相应地应用CSS类

2 个答案: