2016-09-03 4 views
0

私はロゴを追加しましたが、今はnavbarで非常に小さく見えます、ロゴサイズは200x72pxです。私のエラーを説明してください。私は私のナビゲーションバー/ロゴはこのウェブサイト上のナビゲーションバーに見えるようにしたい私のブートストラップnavbarを少し大きくします

.repop-row, 
 
.thumbnail { 
 
    cursor: pointer 
 
} 
 
.ajax-loader, 
 
.offer-n-accept, 
 
.thumbnail { 
 
    text-align: center 
 
} 
 
#declaration, 
 
#save_data, 
 
.ajax-loader, 
 
.error-msg, 
 
.payment_information, 
 
.previews { 
 
    display: none 
 
} 
 
@font-face{font-family:brandfont;src:url(Inversionz.otf)} 
 

 
.branded { 
 
    font-family: brandfont; 
 
    font-size: 350%; 
 
    color: #5CB85C 
 
} 
 
.navbar .navbar-brand, 
 
.navbar-inverse .navbar-brand { 
 
    font-family: brandfont; 
 
    font-size: 40px; 
 
    color: #5CB85C 
 
} 
 
.navbar-default .navbar-brand:hover { 
 
    font-family: brandfont; 
 
    font-size: 40px; 
 
    color: #FFF 
 
} 
 
.row.repsteps, 
 
.row.steps { 
 
    margin-bottom: 10px; 
 
    text-align: center; 
 
    display: none 
 
} 
 
.thumbnail:hover { 
 
    border-color: #2E64FE 
 
} 
 
h1 span { 
 
    color: #2E64FE 
 
} 
 
.offer-n-accept span { 
 
    font-size: 80px 
 
} 
 
.footer-links { 
 
    color: #ebebeb; 
 
    margin-left: 5px; 
 
    margin-right: 5px 
 
} 
 
.repop-row, 
 
.repop-row-selected { 
 
    border: 1px solid #ebebeb; 
 
    padding: 20px; 
 
    margin-left: auto; 
 
    margin-right: auto 
 
} 
 
footer.well { 
 
    background-color: #000; 
 
    color: #FFF; 
 
    margin-top: 0; 
 
    margin-bottom: 0; 
 
    border-top: 10px solid #2e64fe 
 
} 
 
.social-icons { 
 
    font-size: 43px; 
 
    color: #fff 
 
} 
 
.repop-row { 
 
    border-radius: 2px; 
 
    width: 90%; 
 
    height: 90% 
 
} 
 
.repop-row-selected { 
 
    border-radius: 2px; 
 
    width: 90%; 
 
    height: 90%; 
 
    background-color: #2e64fe; 
 
    color: #fff; 
 
    cursor: pointer 
 
} 
 
.repop-row:hover { 
 
    border-color: #2e64fe 
 
} 
 
.repop-row-selected .repop-price-col { 
 
    font-size: 20px; 
 
    color: #333; 
 
    background-color: #fff; 
 
    border-radius: 2px; 
 
    padding: 5px 
 
} 
 
.repop-price-col, 
 
.selected .thumbnail { 
 
    background-color: #2e64fe 
 
} 
 
.repop-price-col { 
 
    font-size: 20px; 
 
    color: #fff; 
 
    border-radius: 2px; 
 
    padding: 5px 
 
} 
 
.repop-row-selected .repop-title-col { 
 
    font-size: 20px; 
 
    margin-top: 4px; 
 
    color: #fff 
 
} 
 
.repop-title-col { 
 
    font-size: 20px; 
 
    margin-top: 4px 
 
} 
 
.selected .thumbnail .caption { 
 
    color: #fff 
 
} 
 
.thumbnail .preview-title { 
 
    font-size: 16px; 
 
    color: #2e64fe 
 
} 
 
span.device-price { 
 
    font-size: 40px; 
 
    color: #337AB7; 
 
    font-weight: 700 
 
} 
 
.facebook-icon:hover { 
 
    color: #3A5795 
 
} 
 
.twitter-icon:hover { 
 
    color: #2B7BB9 
 
} 
 
.howitworks { 
 
    background-color: #F2F2F2; 
 
    padding: 50px; 
 
    margin-bottom: 0 
 
} 
 
.howitworks div h3 { 
 
    color: #2e64fe 
 
} 
 
.howitworks div span.fa { 
 
    font-size: 80px 
 
} 
 
.accessory-selected .thumbnail { 
 
    background-color: #2e64fe 
 
} 
 
.accessory-selected .thumbnail .caption h3 { 
 
    color: #FFF 
 
} 
 
.social-icons { 
 
    margin: 5px 
 
} 
 
.faq { 
 
    background-color: #FAFAFA 
 
} 
 
.item img { 
 
    margin-left: auto; 
 
    margin-right: auto 
 
} 
 
.feature h2 { 
 
    color: #2e64fe 
 
} 
 
.btn-toolbar .btn { 
 
    margin-bottom: 5px 
 
} 
 
@media(max-width:767px){ 
 

 
.h1, 
 
h1 { 
 
    font-size: 32px 
 
} 
 
.h3, 
 
h3 { 
 
    font-size: 18px 
 
} 
 
} 
 
.section-md { 
 
    min-height: 700px!important 
 
} 
 
.navbar-right span { 
 
    width: 20px 
 
} 
 
.repop-row { 
 
    margin-top: 10px 
 
}

:これは私のcustom.cssですhttp://www.techtwice.com/

+0

あなたはそれをjsfiddle.netに表示することができます –

答えて

0

これはやっての多くの方法がありますが、これは私の一般的に使用されているもの:

thumbnail{ 
    height:150px; 
} 

OR

thumbnail{ 
    height: 200%; //This makes the image much more 'responsive' 
} 

上記はサムネイルまたは画像/ロゴの幅を固定し、それに応じて高さが調整されます。

+0

私の正確なロゴサイズは200 x 50ピクセルです。 custom.cssファイルに正確に何を追加する必要がありますか?申し訳ありませんが、私はWeb開発がうまくいかず、Bootstrapフレームワークでうまくいきません。 –

+0

http://www.techtwice.com/このウェブサイトの高さはnavbarとlogoです。私は私のようになりたいです –

+0

代わりに高さを使用することをお勧めします。あなたの場合は、100px - 150pxの高さを問題なく修正する必要があります。 –

関連する問題