【ブログ】他サイトを画像のように埋め込み表示する方法【カスタマイズ】

色々なサイトを巡回していると、他のサイトを画像付きで紹介しているページがたくさんあります。
どうやるのかなーと思い調べてみたら、どうやらiframeタグを使うことで他サイトを画像のように埋め込んで表示しているらしいということがわかりました！

さっそくiframeタグの使い方を調べたので備忘録として記します。

iframeタグの記述

<iframe width="300" height="200" src="http://..." ></iframe>

HTMLの詳細は以下のとおりです。

src=”” 　　 　表示するHPのURL
width=”” 　 　フレームの横幅
height=”” 　　フレームの高さ

クリックを無効にする

フレーム内がクリックできないようにstyle=”pointer-events : none” を設定します。

<iframe width="300" height="200" src="http://..." style="pointer-events : none" ></iframe>

スクロールを無効にする

フレーム内がスクロールしないようにscrolling=”” 　yes/no/autoを設定します。

<iframe width="300" height="200" scrolling="no" src="http://..." style="pointer-events : none" ></iframe>

完成

http://stnavi.info/

言語聴覚士リハビリ情報サイト：STナビさん例にして表示させてみましたｗ

参考にしたサイト
・Asial BLOG
・マンモスと歩く夢を見た