Question

我在我的bootstrap导航栏中的Dropdown一词旁边添加了一个53x53的图像尺寸。导航栏的高度为85px。添加图像使高度调整为100px我需要它保持85px

<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><img class="image_top" src="myimage.png">Dropdown<span class="caret"></span></a>

.image-top {
    float: left;
    display: inline-block;
    margin-top: 7px;
    margin-right: 18px;
    margin-left: 0;
    margin-bottom: 4px;
    padding-right: 10px;
}

Answer 1

你跟上了https://getbootstrap.com/components/#dropdowns？文档是非常好的..虽然它没有图像下拉的例子我认为..

你想要这样的东西吗？

    <div class="dropdown">
  <button style = "padding: 3px;"class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
      <span class="image_top"><img style = "max-width:20px; max-height: 20px;" src="myimage.png"></span>
    Dropdown
    <span class="caret"></span>
  </button>
  <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
    <li><a href="#">Action</a></li>
    <li><a href="#">Another action</a></li>
    <li><a href="#">Something else here</a></li>
    <li role="separator" class="divider"></li>
    <li><a href="#">Separated link</a></li>
  </ul>
</div>

Bootstrap 3将图像添加到下拉列表

1 个答案: