2017-08-25 7 views
1

私はウェブを作成しています。デスクトップビュー用に画像を使用する必要があります。応答性の高いデザインではなく、切り取られた。css3を使用してモバイルビュー用の最小幅の画像を切り取ります

これを行うために、私は700pxの最小幅を確立するCSSルールを作成しました。

問題は、自分のセルにページが表示されているときに、イメージのためにオーバーフローが発生していることです。

私は...のようなオーバーフロー-X隠しとなって、余分なdiv要素で

<div style="max-width: 100%; overflow-x: hidden;"> 
    <img id="pic-bg" class="col-lg-12 col-md-12 col-sm-12 col-xs-12 no-margin no-padding" src="../images/unico.svg"> 
</div> 

を試してみました...しかし、それはどちらか動作しませんでした。

これは私が話していた画像のCSSです:

@media screen and (max-width: 767px){ 

    #pic-bg{ 
     min-width: 700px; 
    } 
} 

は、それがために、このmin-widthのですか?オーバーフローを避けるために画像が切り取られるためには、どうすればいいですか?

答えて

1

これを試してみてください:
HTML:
<img src="">
CSS:
img {height:100px;}

をそれは自動的に画像のサイズを変更します。

関連する問題