YouTube動画など特定のiframeだけcssで幅とかを指定する

ウェブ

最近は動くアドセンス広告なんかもちらほら見かけたりするので、ただ単にiframeにheight: auto;をかけると、意図しない部分までcssの干渉を受けてしまう恐れがあります。

そこで、特定のURLを含むiframeのみにスタイルシートをあてがうカスタマイズをご紹介します。

 

YouTubeのURLが付いたiframeだけにcssを適用する

何かと扱いがややこしいiframeですが、下記の要領でcssを指定してあげれば、狙った部分にのみ変更を加えることができます。

 

【追記】
アドセンス広告のiframeはcssを当てても特に問題ありませんでした。
(Chromeのデバック機能で調整していた時に影響が出ていただけでした。。)

まぁ、レスポンシブやらスマホサイトとかで動画を埋め込む時とかに、何かの参考になればと思います。

こんな記事もよければどうぞ!

© COPYRIGHT 2017 niki weblog