Question

我有一个img标记，正如您在代码中看到的那样，类.pull-left位于类.text-right内部，似乎不允许pull-left正常工作。这就像课程.text-right优先于.pull-left。

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
<a>
  <div class="panel panel-default">
    <div class="panel-body text-right">
      <img class="pull-left" style="position:absolute;" src="http://placehold.it/125x125/000/fff">
      <strong class="pull-right">item</strong>
      <div class="clearfix"></div>
      <div>text</div>
      <div>text</div>
      <div>text</div>
    </div>
  </div>
</a>

有人有什么想法吗？

Answer 1

创建了一个基本的包装器父div，文本正下方是图像。之所以发生这种情况，是因为CSS应该是如何工作的。

父级内的子元素将采用该父容器的特征

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
<a>
  <div class="panel panel-default">
    <div class="panel-body">
      <img class="pull-left" src="http://placehold.it/125x125/000/fff">
      <div class="text-right">
      <strong>item</strong>
      <div class="clearfix"></div>
      <div>text</div>
      <div>text</div>
      <div>text</div>
      </div>
    </div>
    <div class="panel-footer">
      <strong class="pull-left"> text</strong>
      <span class="pull-right">text</span>
      <div class="clearfix"></div>
    </div>
  </div>
</a>

＆＃13;

在“文本右侧”内部使用时如何强制“向左拉”？

1 个答案: