バナナのBloggerカスタマイズ日記 CSS/HTML スマホタグデザイン動画関連【Blogger】スマホでページを開いたときに動画のサイズを自動で最適化する方法

【Blogger】スマホでページを開いたときに動画のサイズを自動で最適化する方法

7/31/2015 CSS/HTML スマホタグデザイン動画関連

Youtubeの動画をブログに埋め込むときの標準サイズは560x315なので、スマホで観覧するとページからはみ出てしまう場合があると思います。

そんな時は以下のコードを挿入するだけで解決します。

<b:if cond='data:blog.isMobile'>
<style type='text/css'>
object,embed,iframe{height:auto;
width:auto;}
</style>
</b:if>

「いいえ。携帯端末で PC テンプレートを表示する。」を選択している人は以下のコードを使用して下さい。

]]></b:skin>

内に

@media only screen and (max-width: 565px) {
object,embed,iframe{max-width:100%;}

]

@media only screen and (max-width:)とは画面の表示領域の横幅がこの値より小さい場合にのみ適用することを指示するものです。

:)

:(

hihi

:-)

:D

=D

:-d

;(

;-(

@-)

:P

:o

:>)

(o)

:p

:-?

(p)

:-s

(m)

8-)

:-t

:-b

b-(

:-#

=p~

$-)

(y)

(f)

x-)

(k)

(h)

cheer

登録: コメントの投稿 (Atom)