2015/08/31
Safariでウェブページのソースコード(HTML ＆ CSS)を見る方法
「Safariでウェブページのソースコードを見ようと思ったら、出来ない!!」
と思いきや、ちゃんと見る方法があったので、備忘録。
メニューバーに"開発"を表示させる
Safariは、なぜかデフォルトではメニューバーに"開発"が表示されていないので、まずそれを表示させます。
メニューバーの「Safari」>「環境設定...」をクリックします。↓
次に、「詳細」タブを開き、最下部の「メニューバーに"開発"を表示」にチェックを入れます。↓
メニューバーに"開発"が追加され、ページのソースを表示することができるようになります。
これで、準備完了です。
ページのソースを表示
それでは、ソースコードを見てみます。
任意のページで、メニューバーの「開発」>「ページのソースを表示」をクリック、↓
もしくは、右クリック>「ページのソースを表示」でも見れます。↓
ショートカットキーを使う場合は、『command + option + U』で見れます。
すると、ウィンドウが上下に分割され、下部にページのソースが表示されます。↓
別ウィンドウアイコンをクリックすると、↓
こんな感じで別ウィンドウで表示され、広々と快適にみる事もできます。↓
あとがき
といった感じで、無事にSafariでウェブページのソースコードをチェックすることができたわけですが、要素の検証等に関しても、ちゃんと要所を押さえてあり、中々イイ感じでした。
というわけでもうちょっと弄ってみて、開発に役立てようかと思います。
