html - 将 Logo 与文本放在同一行+能够调整 Bootstrap 的大小？

Question

我想让文本和图像保持在一行中。尝试使用之前提出的问题中的一些代码，但没有任何帮助....

代码如下:

<div class="form-group form-group1">
                        <span class="mainh">some<br>text</span><br>
                        <span class="mainh1">some text</span><br>
                        <img src="img/logo/newlogo.png" class="img-responsive" pull-right>
                        </div>

还有 CSS:

.form-group1{
margin-top: 100px;
margin-bottom: 100px;
margin-left: 400px;
vertical-align: middle;
}

.mainh{
color: #000;
line-height:28px;
font-size: 43px;
font-family: Arial Black;
}

.mainh1{
color: #000;
font-size:25px;
font-family: Arial;
font-weight: 600;
}

https://jsfiddle.net/pdpgwwp5/

Answer 1

<span>和 <img>都是内联元素，所以它们将是一行......如果你删除换行符(<br />)

.form-group1 {
  margin-top: 100px;
  margin-bottom: 100px;
  margin-left: 400px;
  vertical-align: middle;
}
.mainh {
  color: #000;
  line-height: 28px;
  font-size: 43px;
  font-family: Arial Black;
}
.mainh1 {
  color: #000;
  font-size: 25px;
  font-family: Arial;
  font-weight: 600;
}
.form-group span {
  float: left;
  clear: left;
}
.form-group img {
  float: right;
}

<div class="form-group form-group1">
  <span class="mainh">some text</span>
  <span class="mainh1">some text</span>
  <img src="img/logo/newlogo.png" class="img-responsive pull-right" />
</div>

注意，我输入了pull-right在类属性中，我猜这是一个错字。