2017-08-29 11 views
0

私のロゴはこのWordpressの:ロゴは

enter image description here

のような画面上の通常のサイズを持っていると私は、ブラウザの画面サイズを変更するならば、私のロゴが非常に取得する小さな画面上で非常に小さいサイズを取得します小さい。

enter image description here

ロゴは、前の絵のように小さいサイズを持っていなければなりません。これは、より多くの次の画像のようにする必要があります:

enter image description here

私は別のテーマのがたくさん知っているが、それは、画面をsmalleringことで、大きなロゴを保つことができますか?

答えて

2

ほとんどのWPテーマには、スクリーンサイズの変更に応じてサイトを作成するためのブレークポイントを提供するメディアクエリがあらかじめ設定されています。

これらをカスタムCSSで上書きすることはできますが、まずブレークポイントが見つかるはずです。 this toolを使用して、あなたのCSSに以下のようなものを追加します。画面サイズは400ピクセル以下の場合

@media screen and (max-width: 400px){ 
    .logo{ 
    width:200px !important; 
} 
} 

これは、ロゴの幅を変更します。 400pxをブレークポイントが設定されている値に変更します。この方法で幅や高さを編集することはできますが、必要な場合以外は両方を行う必要はありません。

編集:上記のCSSの ".logo"は、ロゴのクラスが何であれ変更する必要があります。

1

私はあなたがテーマを使用していると仮定しており、これを最初から構築していません。チャンスは、次のような、あなたのテーマは、対応する画像の宣言があります:

.someAwesomeDivName img { 
    width:100%; 
    height:auto; 
} 

とそのイメージを保持する親divのは、その内部の画像に影響を与える特定の幅、です。最初にチェックし、そこから行ってください。

関連する問題