我正在尝试使用twitter bootstrap创建一个“从App Store下载”按钮.
我所遇到的问题是试图使“App Store”文本大于“从…上方下载”文本.
这是我正在使用的HTML和CSS.
.fixed-hero .hero-text {
padding-top: 90px;
width: 65%;
color:#fff;
font-family: Century Gothic,sans-serif;
font-size: 2.2em;
line-height: 1.5em;
}
.fixed-hero .hero-button {
padding-top: 60px;
width: 65%;
}
.btn.btn-large.btn-danger{
border-style:solid;
border-width:1px;
border-color:#fff;
background-image: linear-gradient(to bottom,rgb(204,81,81),#990000);
text-align: left;
}
<div class="hero-button text-center">
<a href="#" class="btn btn-large btn-danger">
<i class="icon-apple icon-3x pull-left"></i>
<div>
Download from the
App Store
</div>
</a>
</div>
感谢您的反馈和专业知识.
解决方法
包装文本并缩小它的font-size：更小或任何你喜欢的大小.
<div class="hero-button text-center">
<a href="#" class="btn btn-large btn-danger">
<i class="icon-apple icon-3x pull-left"></i>
<span style="font-size:smaller;">Download from the</span>
App Store
</a>
</div>
