開発時に役立つhtmlタグ.

9799 ワード
テキストリンク
パズルの過程で、毎回同じラベルだけを繰り返し使用します.そのため、私は二度と勉強の必要性を感じず、世界の変化が速い.とても良いTAGがあって練習してみましょう
ここにオルガンがあり、自動検索機能をサポートする強力なラベルは、必ず暗記して使います.

details, summary

  • jsなしでアコーディオン機能を実現できるラベル
  • cssでdetail[open]プロパティで開いている場合に処理できます.
    • <details>
   <summary>QA.1 TEXT</summary>
   <div>Answer.1 TEXT</div>
</details>
<details>
   <summary>QA.2 TEXT</summary>
   <div>Answer.2 TEXT</div>
</details>

<style>
    details[open]{color:red;}
</style>

    input[type="week,month,time"]

  • inputプロパティは、入力タイプ
    • を選択して1週間単位(所定のシステムで好適)
  • データ表示、下図のようにクリア

    [week]

    [month]

    [time]

    • picture, source

  • は、応答型イメージ
    • を提供することができる.
  • は、4つのイメージではなく、対応するイメージをデバイスからダウンロードし、
    • を表示する.
  • imgタグは、障害のないイメージの
    • には適用されません.
    <picture>
     <source srcset="img3" media="(min-width:1500px)">
     <source srcset="img2" media="(min-width:1000px)">
     <source srcset="img1" media="(min-width:500px)">
     <img src="img0" alt="">
</picture>

    datalist

  • HTMLのみで検索機能を自動保存...(😎)
  • を使用する場合、datalustのidとinputのlist属性は同じでなければなりません.
  • 各オプションの値は格納された値であるため、jsで
    • を追加する必要がある.
    <label for="aa">라벨</label>
<input type="text" id="aa" list="bb" >
<datalist id="bb">
     <option value="1111"></option>
     <option value="222"></option>
     <option value="3333"></option>
</datalist>
    fetch ()がAPIとは何か.
    ambari生成インストール手記