モバイルデバイスで画像を拡大縮小して白い余白スペースを取り除くにはどうすればよいですか？

Question

モバイル/タブレット端末のサイズに合わせて画像を縮小するにはどうすればよいですか？また、768px以下に最小化されると、白いマージンと水平スクロールバーが表示されます。私はこれをbootstrap.cssコードで修正しますか？私は間違って何をしていますか？

http://f13-preview.awardspace.net/groupeezz.dx.am/groupeezz3/index.html

あなたはそれを縮小するとき、私は多少このようにそれをしたいです。私はメディアのクエリを調整しましたが、うまく表示されませんでした。

http://atomtickets.com/

Answer 1

画像、使用率をスケーリングします。 exは...

img { 
    height: 100%; 
    width: 100%; 
} 

あなたのCSSのすべてを見ることなく、右マージンを除去するための私の最高の推測では、あなたが@mediaルールを使用するとリセット

html, body, div, span, applet, object, iframe, 
h1, h2, h3, h4, h5, h6, p, blockquote, pre, 
a, abbr, acronym, address, big, cite, code, 
del, dfn, em, img, ins, kbd, q, s, samp, 
small, strike, strong, sub, sup, tt, var, 
b, u, i, center, 
dl, dt, dd, ol, ul, li, 
fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td, 
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary, 
time, mark, audio, video { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    font-size: 100%; 
    font: inherit; 
    vertical-align: baseline; 
} 

であなたのCSSドキュメントを開始することですモバイルやテーブル用にビルドする場合は、ドキュメント上に存在するものを意識してください。このようなすべての画像をデスクトップや携帯電話でスタイルし、上端を取り除きたいとしましょう。

img { 
    width: 100%; 
    height: 100%; 
    margin-top: 200px; 
} 

実際には、margin-topをゼロにするように指定する必要があります。たとえば、これはまだ余裕トップが表示されます：200pxの...この一方

@media screen and (max-width: 720px) { 
img { 
    width: 100%; 
    height: 100%; 
} 
} 

を実際に携帯で上の余白を削除します。

@media screen and (max-width: 720px) { 
img { 
    width: 100%; 
    height: 100%; 
    margin-top: 0px; 
} 

さらに必要なことを説明してください。 :) }