快速上手HTML代碼
VS Code 迅捷開發(fā)HTML
使用VScode進(jìn)行快速html生成
<div>列表分布2</div>
<div>列表分布1</div>
<div>列表分布2</div>
首先將代碼賦予下方,而后進(jìn)行解釋:
<!DOCTYPE html>
<html lang = :"en">
<head> //頭
<meta charset="UTF-8">
<title>first index</title>//標(biāo)題
</head>
<body>//主體
<div>
<p></p>
</div>
<div>
<nav>
<p>nav下建多個文本</p>
<p></p>
<p></p>
<p></p>
<p></p>
</nav>
</div>
<div>
<nav>
<p></p>
<p></p>
<p></p>
</nav>
</div>
<div>
<p>標(biāo)簽文字</p>
</div>
<div>列表分布1</div>
<div>列表分布2</div>
<div>列表分布3</div>
<div id="view">ID選擇器</div>
<div class="view">Class</div>
<a href="#" id="aa">屬性</a>
<div class="nav">
<div class="item">
<img src="S.png" alt="">
<p>菜單1</p>
<p>菜單2</p>
<p>菜單3</p>
<p>菜單4</p>
<p>菜單5</p>
<p>菜單6</p>
<p>菜單7</p>
<p>菜單8</p>
<p>菜單9</p>
<p>菜單10</p>
</div>
</div>
</body>
</html>
期間主要通過幾部分進(jìn)行分析陳述:
1.<body>的快速敲寫
div:正常的結(jié)構(gòu)都是依次來敲,
<div>
<nav>
<p></p>
</nav>
</div>
然而在vs code中,有一種更為簡單的方法,那就是:
div>nav>p
如此敲寫,如果要創(chuàng)建多行的話,就在p后*行數(shù),即子代的標(biāo)簽結(jié)構(gòu):
div>nav>p*3
這就是三行 <p> </p>
兄弟的標(biāo)簽結(jié)構(gòu):
div>nav>p+a
代碼如下:
<div>
<nav>
<b>B</b>
<a href="">A</a>
</nav>
</div>
分類標(biāo)簽
<div>
<p>標(biāo)簽文字</p>
</div>
div>(nav>p)*2 :
<div>
<p>標(biāo)簽文字</p>
<p>標(biāo)簽文字</p>
</div>
div{列表分布$}*3 /* 幾個$值就會有幾個字符 */
<div>列表分布1</div>
<div>列表分布2</div>
<div>列表分布3</div>
div{列表自3行開始$$@3}*2
<div>列表分布3</div>
ID選擇器#
#view
<div id="view">ID選擇器</div>
CLASS.
.view
<div class="view">Class</div>
屬性:
a[href=# id=aa class=bg]
<a href="#" id="aa" class="bg">
屬性
</a>

浙公網(wǎng)安備 33010602011771號