トップページ |  ログイン画面へ
 
大口会員向け会員登録
Save Your Time 本とデジタルのいいとこどり
トップページ きる くわえる おせる
会社の仕組 個人スキル
  • 自社で出来ることが「力」です。
    企業の発展と個人の成長を目的としたサイトです。

  • 経営者のための必須情報
    必ずできる、わかりやすいガイド
    自社用にカスタマイズも可能

  • すぐに使える、個人向けコンテンツ
    そのまま使える豊富なテンプレート
    わかり易い目次と使える検索機能


 会員の方はログインをお願いします。

初めての方へ
10 Webページをデバッグする Edge

10 Webページをデバッグする Edge

レベル:30 中級  ページ数:3
ID:D4sea10benri-25debug--10-edge000

配送料無料

WebページのデバッグにEdgeを利用する方法

会員の方はログインをお願いします。
ログイン画面へ

当サイトは、有料会員制です。
会員登録画面へ

このコンテンツは、個人スキル会員向けのコンテンツです。

フルページのコンテンツを見たり、ダウンロードするには、会員になることが必要です。

D4 ブラウザーの活用と検索術 - 10 ブラウザーの便利な活用法 - 25 Webページのデバッグに利用
30 中級

10 Webページをデバッグする Edge


WebページのデバッグにEdgeを利用する方法
Edgeには、「開発者ツール」という機能があり、Webページのデバッグに利用することができます。
Web上の要素をクリックすると、その要素を表すHTMLのコードと、適用されているCSSのコードが表示され、正しくコーディングされているかを確認することができます。
また、その場で、CSSのコードを一時的に変更して、Webページの表示が、どのように変わるのかを、チェックすることなどもできます。
非常に多くの機能がありますが、基本的な機能の部分を説明します。

【1.開発者ツールの画面】

開発者ツールを起動すると、下図のように、Edgeの画面が3分割されて、実際のWebページの表示と、HTMLのコードと、CSSのコードとを同時に確認することができます。

【2.開発者ツールの起動方法】

デバッグしたいWebページをEdgeで開き、開発者ツールを起動します。
起動方法には、3つのやり方があります。いずれかの方法で起動します。

(1)デバッグしたい要素が決まっている場合

Webページのデバッグしたい要素を、「右クリック」して、「要素の検査」をクリックします。

フルページのコンテンツを見たり、ダウンロードするには、会員になることが必要です。

このコンテンツは 2019/4/11 に登録されました。

一番上に戻る


選択して下さい:

ダウンロード



 | トップページ |