遠位端部(6)〜htmlのレビューを学びます

主な内容

  • HTMLの共通要素

  • 分類html要素

  • HTML要素にネスト関係

  • HTMLとCSSリセットのデフォルトのスタイル要素

  • HTMLの共通のインタビューの質問

  • HTMLの共通要素

    要素要素頭部領域、ボディ領域:HTML共通の要素は、2つのカテゴリに分けられます。ここでは、それぞれ紹介します。

    html要素1、ヘッド領域

    HTML要素の頭部領域、ページ上で直接コンテンツを離れることなく。

    • メタ

    • 題名

    • スタイル

    • リンク

    • 脚本

    • ベース

    基本要素が導入されました:

    <基地HREF = "/">

    パスラベルは、基本的に指定しました。リンクのすべてを指定した後、ベンチマークとして、このパスに基づいています。

    図2に示すように、HTML要素(ボディ領域)

    html要素のボディ領域は、ページ上で直接表示されます。

    • divの、セクション、記事、さておき、ヘッダー、フッター

    • P

    • スパン、EM、強いです

    • 表要素:表、THEAD、TBODY、TR、TD

    • リスト要素:UL、OL、DL、DT、DD

    • A

    • フォーム要素:フォーム、入力、選択し、テキストエリア、ボタン

    重要な属性の共通ラベル:

    • [HREF、目標]
    • IMG [SRC、ALT]
    • テーブルTD [COLSPAN、ROWSPAN]。現在のセルを設定すると、いくつかの奇数行を占めます。あなたはセルを結合すると、それが使用されます。
    • フォーム[目標、方法、ENCTYPE]
    • 入力[タイプ、値]
    • ボタン[タイプ]
    • 選択>オプション[値]
    • ラベル[用]

    HTMLドキュメントのアウトライン

    一般的なHTML文書は、その構造があることができます:

    コードをコピー
        <sectionTop> 
            </ H1の>タイトル<H1の> 
    
            <sectionTop> 
                <H2>小見出し</ H2> 
                <P>段落である</ P> 
            </ sectionTop> 
    
            <sectionTop> 
                <H2>小見出し</ H2> 
                <P>段落です。</ P> 
            </ sectionTop> 
    
            <余談> 
                <P>広告コンテンツ</ P> 
            </さておき> 
    
        </ sectionTop> 
    
        <フッタ> 
            <P> XYZ社の出版社</ P> 
        < /フッタ>
    コードをコピー

    分類html要素

    スタイルカテゴリーによると:

    • ブロックレベル要素

    • 行内元素

    • インラインブロック:例えば、formフォーム要素。外部徴候が(ない別の行に)の要素をインライン、性能は内部ブロック要素(幅と高さを設けてもよい)です。

    HTML要素にネスト関係

    • ブロック要素は、インライン要素を含んでもよいです。

    • 必ずしもブロックレベルない要素をブロックレベル要素を含みます。たとえば、divがDIV、pタグを含めることができますが、div要素を含めることはできません。

    • 通常、素子列は、ブロックレベル要素を含めることはできません。例えば、スパンは、div要素を含めることはできません。HTML5には、タグはdiv要素を含めることができます。しかし、特別な場合があります。

    注:ではHTML5は  a > div 合法で  div > a > div違法である。しかし、HTML 4.0.1で、  a > div まだ違法です。

    HTMLとCSSリセットのデフォルトのスタイル要素

    例えば、ドロップダウンボックスのデフォルトが付属していたスタイルのより複雑な要素という。このデフォルトのスタイルがなければ、ページ上の要素はどんなパフォーマンスを持っていない、それは間違いなく、ワークロードの数が増加します。

    同時に、デフォルトのスタイルは、いくつかの問題をもたらす:例えば、私たちのデフォルトのスタイルのいくつかは必須ではありません。いくつかのも、デフォルトのスタイルを削除することはできません。

    CSSのリセット:我々は概念を導入する必要があるデフォルトのスタイルを、必要としない場合。

    一般的なCSSのリセットプログラム

    オプション1:

    CSSツール:リセットCSS。リンク:https://meyerweb.com/eric/tools/css/reset/

    オプション2:

    YahooのCSSリセット。リンク:https://yuilibrary.com/yui/docs/cssreset/

    私たちは、直接CDNを導入する方法によって次のことができます。

    <リンクのrel = "スタイルシート" タイプ= "テキスト/ cssの" のhref = "http://yui.yahooapis.com/3.18.1/build/cssreset/cssreset-min.css">

    三つの方法より多くの物議:()

    * { 
        マージン:0。
        パディング:0; 
    }

    何が比較的単純な、上記の書かれているが、それはまた議論があります。パフォーマンスの問題CSSセレクタを引き起こす可能性があり物議場所。

    Normalize.css

    いくつかのCSSのリセット上記のソリューションは、次のとおりです。デフォルトのスタイルのすべてがクリアされます。

    しかし、Normalize.cssの  考え方は次のとおりです。ブラウザがこれらのデフォルトスタイルを提供するので、それは理にかなっています。異なるブラウザのデフォルトスタイルは矛盾しているので、その後、Normalize.css一貫性のデフォルトのスタイル設定となります。

    HTMLの共通のインタビューの質問

    DOCTYPEの意味は何ですか

    • ブラウザが標準モードでレンダリングしてみましょう

    • ブラウザは正当性の要素を教えてください

    HTML、XHTML、HTML5の違い

    • SGMLに属しHTML

    • XHTMLはXMLに属し、XMLのためのHTMLは厳しいの結果であります

    • HTML5は、XHTMLよりも緩い(HTML5仕様の独自の独立したセットがあります)SGMLに属し、またXMLはありません。

    新しいHTML5の変更は何ですか

    • 新しいセマンティック要素

    • フォームの機能強化

    • 新しいAPI:オフライン、オーディオおよびビデオ、グラフィックス、リアルタイム通信、ローカルストレージ、デバイスの機能。

    EMとの差I

    共通:どちらも、イタリック体で表されます。

    違い:

    • EMは、強調のためのセマンティックタグです。

    • 私はイタリック、純粋なスタイルのタグです。HTML5はお勧めしません。

    セマンティックの意味は何ですか

    • 開発者は簡単に、保守が容易に理解します。

    • マシン(検索エンジン、スクリーンリーダーなど)を簡単な構造を理解します

    • SEOに役立ちます

    要素は、自動閉鎖することができ

    自閉症の要素とは、他の要素に埋め込むことができません。HTML5のスラッシュと要件。

    • フォーム要素の入力

    • 写真IMG

    • BR、時間

    • メタリンク

    フォームフォームの役割

    • 直接フォームを送信

    • 利用提出/リセットボタン

    • フォームの保存が容易ブラウザ

    • (例えばjQueryのような)サードパーティのライブラリは、全体的な値を得ることができます

    • サードパーティのライブラリは、検証を形成することができます

    我々はAjaxを介して、フォームデータを提出しているのであれば、また、フォームを追加することを提案しました。

    より詳細な研究ができるw3schoolになります

おすすめ

転載: www.cnblogs.com/drggvxcvx13/p/12513849.html