iframe要素のスマホ対応 – CSSとJavaScriptそれぞれのレスポンシブ対応方法
﹁CSS﹂でiframe要素をレスポンシブ対応させるまずは、CSSでiframe要素をレスポンシブ対応させる方法を説明します。CSSオンリーでもレスポンシブ対応させることができます。以下のYouTubeの動画はiframe要素となっています。これから説明するCSSでレスポンシブ対応させています。 Design for a Mobile MindHTML – iframe要素をラップするHTMLの方では、レスポンシブ対応させたいiframe要素をdiv要素などでラップします。それぞれにclass属性などで名前をつけます。iframe要素はできたらサイズの指定をしておきます。 <div class="iframe-wrapper"> <iframe width="560" height="315" src="https://www.youtube.com/embed/xqviGwyy7y0?r
