Question

我正在使用bootstrap 3.3.7，我想在达到col-sm-6时将文本对齐方式更改为Left。如果尚未达到此级别，则文本对齐方式正确。我该怎么办？

以下是我的div：

<div class="col-sm-6 text-right" style="padding-bottom:10px; padding-top:10px" >
   <a class="BAN_ForgotPass" href="#">Forgot the password ?</a>
</div>

我试图在标题中的脚本css中添加它但是没有工作：

 <style type="text/css"> 
        @media (max-width: 767px) {
            footer .text-right { text-align:left }
        }    
 </style>

有什么建议吗？

另一个问题是：无论如何在javascript或jquery中检测是否达到col级别？我问这个是因为有时我们需要隐藏图像或在某些级别添加某些内容...... 例如：到达col-sm-6时隐藏图像x。有可能吗？

Answer 1

假设你有正确的bootstrap HTML，那么这应该可行

@media (max-width:767px) {
  .container .text-right {
    text-align: left
  }
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<div class="container">
  <div class="row">
    <div class="col-sm-6 text-right">
      <a class="BAN_ForgotPass" href="#">Forgot the password ?</a>
    </div>
  </div>
</div>

要回答您的第二个问题，关于隐藏您可以使用的utility classes元素hidden-sm和hidden-xs

Answer 2

尝试以下代码

@media (max-width: 767px) {
            .text-right { text-align:left; }
        }

Answer 3

使用内联CSS在您的页面中尝试此操作，如果可以正常使用外部CSS

result = matmul(first_array, second_array)

如果这样可以为您想要的每个更改创建一个单独的CSS 喜欢图像隐藏在上面的代码中添加以下行

       .col-sm-6
{
text-align:left;
}

在引导程序中达到col级别时更改文本对齐

3 个答案: