Question

我为要转动的row2制作了一个课程img。当可见性为img和xs时，我想要旋转三个sm元素。

现在我的问题是，如果最高可见度为img且visible-xs而visible-sm和visible-md没有轮换，我该如何轮换visible-lg？< / p>

       <div class="row2">
          <div class="visible-lg col-lg-3" id="particulier">

          </div>
          <div class="col-xs-12 col-md-4 col-lg-2" id="particulier">
            <a href="http://www.egcomputerspecialisten.nl/page/176"><img alt="" src="particulier.jpg" class="img-responsive center-block" /></a>
         </div>
          <div class="col-xs-12 col-md-4 col-lg-2" id="webshop">
            <a href="http://shop.egcomputerspecialisten.nl/?pk_campaign=egcs.nl&pk_kwd=menu_link "><img alt="" src="webshop.jpg" class="img-responsive center-block" /></a>
          </div>
          <div class="col-xs-12 col-md-4 col-lg-2" id="zakelijk">
            <a href="http://www.egcomputerspecialisten.nl/news/8"><img alt="" src="zakelijk.png" class="img-responsive center-block" /></a>
          </div>
          <div class="visible-lg col-lg-3" id="particulier">

          </div>
        </div>

风格：

.row2 {
        -ms-transform: rotate(-0.5deg); /* IE 9 */
        -webkit-transform: rotate(-0.5deg); /* Chrome, Safari, Opera */
        transform: rotate(-0.5deg);
    }

希望你们能帮帮我。

Answer 1

使用媒体查询

用于xs屏幕

@media only screen and (max-width : 480px) {
  img {
     //style
  }
}

用于sm屏幕

@media only screen and (max-width : 768px) {
    img {
     //style
  }
}

Answer 2

要更正@Panto，bootstrap在default

之后有以下断点

alter table Studies
with check add constraint CK_Points
check (dbo.EnrollmentFunction(pnr) = 'True')

所以@Twan在你的情况下你必须在

里面写课

/* xs */
@media (max-width: 767px) {}
/* sm */
@media (min-width: 768px) and (max-width: 991px) {}
/* md */
@media (min-width: 992px) and (max-width: 1199px) {}
/* lg */
@media (min-width: 1200px) {}

还有一个关于代码的说明。没有必要在col-lg-X类中使用visible-lg。

如何在visible-xs和visible-sm bootstrap中旋转img

2 个答案: