2016-10-02 6 views
1

私のサイトこのログイン画面には、下部にフッターがあります。 このページはデスクトップモニタ用に最適化されており、サイト自体は既にパソコンとモバイルの両方に最適化されているため、新しいモバイルバージョンを作成する手間を省いています。モバイルでオブジェクトを削除する

私はここでそれを求めているので、スクリプトを使って作業するのはうまくありません: 画面サイズが400pxより小さいときにフッターを削除するスクリプトを作成できますか?

ここで問題の写真がありますか、皆さんは私に解決策を与えることができますか? ありがとうございます!

Normal desktop view

When on mobile, the footer covers it -> I want the footer removed

+0

あなたのコードを入力してください。ブートストラップを使用している場合は –

+1

.hidden-xs –

答えて

1

使用CSS @media

エクストラ小型デバイス電話(< 768px)(クラス名:

/* From 0 to 992px Device Width */ 
@media (max-width: 992px) { 

    #footer { 
     display: none; 
     // Other styles here 
    } 

} 
0

あなたは、ブートストラップを使用している場合。 visible-xs-block、hidden-xs)

小型デバイス錠剤(≥768px)(クラス名:.visible-SM-ブロック、隠れ-SM)

メディアデバイスは(≥992px)(クラス名をデスクトップ:.visible-MD-詳細については.visible-LG-ブロック、隠された-LG)

を::http://getbootstrap.com/css/#responsive-utilities

ブロック、隠された-MD)

大型のデバイスは(≥1200px)(クラス名をデスクトップ

あなたがいない場合フッタークラスが.footerであると仮定して、フッターの@mediaクエリを追加する必要があります。そのメディアクエリは、次のようになります。

@media screen and (max-width: 480px) { 
 
    .footer { 
 
     display: none; 
 
    } 
 
}

関連する問題