自動的に私は非常に簡単質問のためにいくつかの助けを探しています最大の画面サイズ

に基づいて、ボタンのサイズを調整する方法：私は475ピクセルのピクセル幅の製品ページ上のAddtoCartボタンを持って自動的に私は非常に簡単質問のためにいくつかの助けを探しています最大の画面サイズ

（以下のコードを参照してください）：

#AddToCart { 

width: 475px; 

}

このサイズはデスクトップブラウザでは完璧です。しかし、スマートフォン（Iphone）で見ると、ボタンは画面にフィットしません（ワイドに）。ディスプレイの幅が475ピクセル未満の場合、ボタンの幅をディスプレイの最大幅に自動的に縮小する方法はありますか？

多くのありがとうございます。

2017-10-27 Maximus000

CSS 'MAX-width'は？ 'max-width：475px'でブラウザーが小さければ、' 100％ 'に"フォールバック "し、画面の全幅を使うだけです。（おそらく他のオプションのトン、キーワードは* responsiveウェブデザイン*でしょう） – Aufziehvogel

meta-queriesを使用してレスポンシブデザインを作成することができます。マルチサポートディスプレイに最適なソリューションだと思います。

また、相対的なサイズを使用することができます。

width : 20%;

それは、コンテナのサイズに比較的調整します。

2017-10-27 21:36:00 Hollyol

私はあなたを助けることができてうれしい – Hollyol

さまざまなブレークポイントで幅を変更するために、メディアクエリと一緒にvw（例：90vwは常にビューポート幅の90％）を使用できます。

@media screen and (max-width: 768px) { INSERT STYLE FOR 0-768px SCREENS}

@media screen and (min-width: 769px) { INSERT STYLE FOR 769px+ SCREENS}

ここでメディアクエリの詳細があります：たぶんhttps://www.w3schools.com/cssref/css3_pr_mediaquery.asp

2017-10-27 21:43:03

答えて