グループの友達の一人が尋ねるのは本当ですか:
教師、教師はどのようにビデオに入力でき
ul>li*6
ますか?出られないの?
外に出られない理由は言わないでください、これは私です...(少しは言いたくありません)
私が伝えたいのは、なぜそれが出てくるのかということです。
通常私たちが開発をしているとき
- 最も時間のかかる作業は、HTMLおよびCSSコードの記述です。タグ、属性、ブラケットなどの束、頭痛。
- 私はよくhtmlを繰り返し構造で書きます。重複するコードをすべてコピーして貼り付けると、非常に面倒になります。
また、プログラマーは非常に怠惰であることも知っています。
それで emmet というプラグインがあります、それをインストールしていないと言いたいですか?このツールのほとんどのエディターは組み込みですのでご安心ください。
用hbuilderX
例:Sublime Text
、Notepad++
、VS code
、、Dreamweaver
とのようにします。
次に、このプラグインのemmetの使用法を見てみましょう!
エディターで新しいhtmlファイルを作成し、基本的なhtml構造コードを作成して、私と一緒にエメット を体験してください !
正しい!そうです、1つ目は、私たちがよく使用するhtmlの初期構造です。このhtmlの初期構造は、毎回手を入力したい場合は、それについて考えてください。。。
vscode
例:直接1つ!次に、Tabキーを押して戦闘を解決します。
hbuilderX
例:HTMLを送信し、Enterキーを押し て戦闘を解決します。
文法規則について話し始めます。
最初に発生した問題の解決を開始します
1.子孫の入れ子
あなたが書きたい場合はul
、ul
内部ライトaをli
、li
書き込みの内側にspan
、することができます
HTMLドキュメントに入力し ul>li>span
、その後、あなたの押しtab
キーを、以下のコードが生成されます
2.ブラザー
書きたい場合はh2
、以下に従ってくださいp
。
HTMLドキュメントに入力し h2+p
、その後、あなたの押しtab
キーを、以下のコードが生成されます
3.グループの入れ子
合計div
を書きたい場合。h2
p
htmlドキュメントを入力し、 div>(h2+p)
タブキーを押すと、次のコードが生成されます。
4.乗算
あなたの問題を解決するために是非!!!
あなたが書きたい場合はul
、ul
内部の書き込みよりli
、各li
書き込みの内側にはspan
、どのようにそれを書くには?
私たちは、HTML文書に入力し ul>li*5>span
、その後、あなたの押すtab
キーは、以下のコードが生成されます。
これは便利ですか?table
フォームを書くときにも役立ちますか?
役立つヒントはたくさんあります。続けましょう。
5.自動成長
1つ作成したい場合ul
、その中に5 つli
ありli
、クラス名はまだitem-1
このフォームに似ています
HTMLドキュメントに入力し ul>li.item-$*5
、その後、あなたの押しtab
キーを、以下のコードが生成されます。
6、IDおよびクラス
div#box
<div id="box"></div>
div.box
<div class="box"></div>
7.テキスト
div{test}
<div>test</div>
上記はemmet
一般的な構文です!