スキルアップはこちら!!▶[click]
スキルアップのページはこちら

WEBサイトの作り方やブログを覚えたい・スキルアップしたい時にオススメが「WordPress(ワードプレス)」の使い方を覚えることです。一緒にスキルアップして、未来を変えましょう!

詳細はこちら

【HTML】iframeのスクロールバーを非表示・無効にする

HTML(エイチティーエムエル)
この記事は約2分で読めます。

ページ内にiflameで埋め込みをすると、画面に収まらない場合はスクロールバーが表示されてしまいます・・・。こちらをCSSを使って、消してみます。

 <iframe src="https://demo.eguweb.net/p004/" width="500" height="500"></iframe>

scrolling=”no”

 <iframe src="https://demo.eguweb.net/p004/" width="500" height="500" scrolling="no"></iframe>

scrolling=”no”を入れると、スクロールバーが消えます。

スクロールバーが、消えました。

ただ、このままだとiflameの枠が残ったままになってしまうので、こちらも消してみます。

frameborder=”no”

<iframe src="https://demo.eguweb.net/p004/" width="500" height="500" scrolling="no" frameborder="no"></iframe>

frameborder=”no”を入れることで、枠線も消えました!

まとめ

このような感じで、iframeの中に「scrolling=”no”」「frameborder=”no”」を入れることで、iframeのスクロールバー・枠線を消して埋め込むことができます。

他にも考慮する点がありそうかな・・・?という気もしますが、ひとまず。

ご参考ください😃

タイトルとURLをコピーしました