23

Twitterブートストラップを使用して「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>

フィードバックと専門知識に感謝します。

4

2 に答える 2

21

テキストを折り返して、font-size:smaller または任意のサイズで縮小します。

<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>
于 2013-07-10T19:46:04.943 に答える