javascript - 如何在 twitter bootstrap 中使元素响应

Question

我有一个自己设计的 bootstrap 主题，它非常灵敏，可以立即调整屏幕尺寸缩小，但是当我向图像添加一些 javascript 功能使其在悬停时有一个覆盖，带有一些小的 css，图像变形，它永远不会缩小，我希望覆盖层保留，如果有人可以帮助它保持其响应能力，我恳求......这是下面的 html 代码片段，以及一些内联样式表，其余样式表是 twitter bootstrap 默认样式表

<div class="container marketing" style="padding-top: 20px;">
<div class="row">
    <div class="span8"> 
        <span class="label label-info">EXCLUSIVE</span>
        <img id="d1" src="img-data/underage-marriage/nigeria-underage-marriage.jpg">
        <div class="contenthover" style="margin-top:10%;">
            <div class="row-fluid text-center" style="border-bottom:1px #CCC dashed; padding-bottom:3%;">
                <div class="span8" style="border-right:1px #CCC dashed; padding-right: 2%;">
                    <h1 class="pull-right" style="border-bottom:1px #CCC dashed;"><img src="img/brainstorm.png"><b><i>discussion</i></b></h1>
                  <h1><small class="pull-right">Keep your language clean.</small></h1>
                </div>
                <div class="span4" style="padding-top:3%;">
                    <button type="button" class="btn btn-large btn-danger pull-left" data-loading-text="Loading...">View Article</button>
                </div>
            </div>
            </div>
          </div>
          <div class="span4"></div>
        </div>
    </div>

<!-- stylesheet -->
<style>
  .contenthover { padding:20px 20px 10px 20px; }
  .contenthover, .contenthover h3, contenthover a { color:#fff; }
  .contenthover h3,
  .contenthover p {
    margin:0 0 10px 0; line-height:1.4em; padding:0;
  }                    
</style>

Answer 1

尝试将类“row”更改为“row-fluid”。