码迷，mamicode.com
首页 > Web开发 > 详细

visual studio code快速生成Html头部信息和炫酷的代码补全

时间：2016-05-26 07:31:07      阅读：387      评论：0      收藏：0      [点我收藏+]

标签：

html:4t、html:4s、html:xt、html:xs、html:xxs、html:5

 

Child: >

nav>ul>li
<nav> <ul> <li></li> </ul> </nav>

Sibling: +


div+p+bq
<div></div> <p></p> <blockquote></blockquote>

Climb-up: ^


div+div>p>span+em^bq
<div></div> <div> <p><span></span><em></em></p> <blockquote></blockquote> </div>
div+div>p>span+em^^bq
<div></div> <div> <p><span></span><em></em></p> </div> <blockquote></blockquote>

Grouping: （）


div>（header>ul>li*2>a）+footer>p
<div> <header> <ul> <li><a href=""></a></li> <li><a href=""></a></li> </ul> </header> <footer> <p></p> </footer> </div>
（div>dl>（dt+dd）*3）+footer>p
<div> <dl> <dt></dt> <dd></dd> <dt></dt> <dd></dd> <dt></dt> <dd></dd> </dl> </div> <footer> <p></p> </footer>

Multiplication: *


ul>li*5
<ul> <li></li> <li></li> <li></li> <li></li> <li></li> </ul>

Item numbering: ￥


ul>li.item￥*5
<ul> <li class="item1"></li> <li class="item2"></li> <li class="item3"></li> <li class="item4"></li> <li class="item5"></li> </ul>
h￥[title=item￥]{Header ￥}*3
<h1 title="item1">Header 1</h1> <h2 title="item2">Header 2</h2> <h3 title="item3">Header 3</h3>
ul>li.item￥￥￥*5
<ul> <li class="item001"></li> <li class="item002"></li> <li class="item003"></li> <li class="item004"></li> <li class="item005"></li> </ul>
ul>li.item￥＠-*5
<ul> <li class="item5"></li> <li class="item4"></li> <li class="item3"></li> <li class="item2"></li> <li class="item1"></li> </ul>
ul>li.item￥＠3*5
<ul> <li class="item3"></li> <li class="item4"></li> <li class="item5"></li> <li class="item6"></li> <li class="item7"></li> </ul>

ID and CLASS attributes


＃header
<div id="header"></div>
.title
<div class="title"></div>
form＃search.wide
<form id="search" class="wide"></form>
p.class1.class2.class3
<p class="class1 class2 class3"></p>

Custom attributes


p[title="Hello world"]
<p title="Hello world"></p>
td[rowspan=2 colspan=3 title]
<td rowspan="2" colspan="3" title=""></td>
[a=""value1"" b="value2"]
<div a="value1" b="value2"></div>

Text: {}


a{Click me}
<a href="">Click me</a>
p>{Click }+a{here}+{ to continue}
<p>Click <a href="">here</a> to continue</p>

Implicit tag names


.class
<div class="class"></div>
em>.class
<em><span class="class"></span></em>
ul>.class
<ul> <li class="class"></li> </ul>
table>.row>.col
<table> <tr class="row"> <td class="col"></td> </tr> </table>

 

HTML

 


All unknown abbreviations will be transformed to tag， e.g. foo → <foo></foo>.

 

!

Alias of html:5


<!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>Document</title> </head> <body> </body> </html>
a
<a href=""></a>
a:link
<a href="http://"></a>
a:mail
<a href="mailto:"></a>
abbr
<abbr title=""></abbr>
acronym
<acronym title=""></acronym>
base
<base href="" />
basefont
<basefont />
br
<br />
frame
<frame />
hr
<hr />
bdo
<bdo dir=""></bdo>
bdo:r
<bdo dir="rtl"></bdo>
bdo:l
<bdo dir="ltr"></bdo>
col
<col />
link
<link rel="stylesheet" href="" />
link:css
<link rel="stylesheet" href="style.css" />
link:print
<link rel="stylesheet" href="print.css" media="print" />
link:favicon
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />
link:touch
<link rel="apple-touch-icon" href="favicon.png" />
link:rss
<link rel="alternate" type="application/rss+xml" title="RSS" href="rss.xml" />
link:atom
<link rel="alternate" type="application/atom+xml" title="Atom" href="atom.xml" />
meta
<meta />
meta:utf
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
meta:win
<meta http-equiv="Content-Type" content="text/html;charset=windows-1251" />
meta:vp
<meta name="viewport" content="width=device-width， user-scalable=no， initial-scale=1.0， maximum-scale=1.0， minimum-scale=1.0" />
meta:compat
<meta http-equiv="X-UA-Compatible" content="IE=7" />
style
<style></style>
script
<script></script>
script:src
<script src=""></script>
img
<img src="" />
iframe
<iframe src="" frameborder="0"></iframe>
embed
<embed src="" type="" />
object
<object data="" type=""></object>
param
<param name="" value="" />
map
<map name=""></map>
area
<area shape="" coords="" href="" />
area:d
<area shape="default" href="" />
area:c
<area shape="circle" coords="" href="" />
area:r
<area shape="rect" coords="" href="" />
area:p
<area shape="poly" coords="" href="" />
form
<form action=""></form>
form:get
<form action="" method="get"></form>
form:post
<form action="" method="post"></form>
label
<label for=""></label>
input
<input type="text" />
inp
<input type="text" name="" id="" />
input:hidden

Alias of input[type=hidden name]


<input type="hidden" name="" />
input:h

Alias of input:hidden


<input type="hidden" name="" />
input:text， input:t

Alias of inp


<input type="text" name="" id="" />
input:search

Alias of inp[type=search]


<input type="search" name="" id="" />
input:email

Alias of inp[type=email]


<input type="email" name="" id="" />
input:url

Alias of inp[type=url]


<input type="url" name="" id="" />
input:password

Alias of inp[type=password]


<input type="password" name="" id="" />
input:p

Alias of input:password


<input type="password" name="" id="" />
input:datetime

Alias of inp[type=datetime]


<input type="datetime" name="" id="" />
input:date

Alias of inp[type=date]


<input type="date" name="" id="" />
input:datetime-local

Alias of inp[type=datetime-local]


<input type="datetime-local" name="" id="" />
input:month

Alias of inp[type=month]


<input type="month" name="" id="" />
input:week

Alias of inp[type=week]


<input type="week" name="" id="" />
input:time

Alias of inp[type=time]


<input type="time" name="" id="" />
input:number

Alias of inp[type=number]


<input type="number" name="" id="" />
input:color

Alias of inp[type=color]


<input type="color" name="" id="" />
input:checkbox

Alias of inp[type=checkbox]


<input type="checkbox" name="" id="" />
input:c

Alias of input:checkbox


<input type="checkbox" name="" id="" />
input:radio

Alias of inp[type=radio]


<input type="radio" name="" id="" />
input:r

Alias of input:radio


<input type="radio" name="" id="" />
input:range

Alias of inp[type=range]


<input type="range" name="" id="" />
input:file

Alias of inp[type=file]


<input type="file" name="" id="" />
input:f

Alias of input:file


<input type="file" name="" id="" />
input:submit
<input type="submit" value="" />
input:s

Alias of input:submit


<input type="submit" value="" />
input:image
<input type="image" src="" />
input:i

Alias of input:image


<input type="image" src="" />
input:button
<input type="button" value="" />
input:b

Alias of input:button


<input type="button" value="" />
isindex
<isindex />
input:reset

Alias of input:button[type=reset]


<input type="reset" value="" />
< name="" id=""></>
option
<option value=""></option>
textarea
<textarea name="" id="" cols="30" rows="10"></textarea>
menu:context

Alias of menu[type=context]>


<menu type="context"></menu>
menu:c

Alias of menu:context


<menu type="context"></menu>
menu:toolbar

Alias of menu[type=toolbar]>


<menu type="toolbar"></menu>
menu:t

Alias of menu:toolbar


<menu type="toolbar"></menu>
video
<video src=""></video>
audio
<audio src=""></audio>
html:xml
<html xmlns="http://www.w3.org/1999/xhtml"></html>
keygen
<keygen />
command
<command />
bq

Alias of blockquote


<blockquote></blockquote>
acr

Alias of acronym


<acronym title=""></acronym>
fig

Alias of figure


<figure></figure>
figc

Alias of figcaption


<figcaption></figcaption>
ifr

Alias of iframe


<iframe src="" frameborder="0"></iframe>
emb

Alias of embed


<embed src="" type="" />
obj

Alias of object


<object data="" type=""></object>
src

Alias of source


<source></source>
cap

Alias of caption


<caption></caption>
colg

Alias of colgroup


<colgroup></colgroup>
fst， fset

Alias of fieldset


<fieldset></fieldset>
btn

Alias of button


<button></button>
btn:b

Alias of button[type=button]


<button type="button"></button>
btn:r

Alias of button[type=reset]


<button type="reset"></button>
btn:s

Alias of button[type=submit]


<button type="submit"></button>
optg

Alias of optgroup


<optgroup></optgroup>
opt

Alias of option


<option value=""></option>
tarea

Alias of textarea


<textarea name="" id="" cols="30" rows="10"></textarea>
leg

Alias of legend


<legend></legend>
sect

Alias of section


<section></section>
art

Alias of article


<article></article>
hdr

Alias of header


<header></header>
ftr

Alias of footer


<footer></footer>
adr

Alias of address


<address></address>
dlg

Alias of dialog


<dialog></dialog>
str

Alias of strong


<strong></strong>
prog

Alias of progress


<progress></progress>
datag

Alias of datagrid


<datagrid></datagrid>
datal

Alias of datalist


<datalist></datalist>
kg

Alias of keygen


<keygen />
out

Alias of output


<output></output>
det

Alias of details


<details></details>
cmd

Alias of command


<command />
doc

Alias of html>（head>meta[charset=UTF-8]+title{￥{1:Document}}）+body


<html> <head> <meta charset="UTF-8" /> <title>Document</title> </head> <body> </body> </html>
doc4

Alias of html>（head>meta[http-equiv="Content-Type" content="text/html;charset=￥{charset}"]+title{￥{1:Document}}）+body


<html> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>Document</title> </head> <body> </body> </html>
html:4t

Alias of !!!4t+doc4[lang=￥{lang}]


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>Document</title> </head> <body> </body> </html>
html:4s

Alias of !!!4s+doc4[lang=￥{lang}]


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>Document</title> </head> <body> </body> </html>
html:xt

Alias of !!!xt+doc4[xmlns=http://www.w3.org/1999/xhtml xml:lang=￥{lang}]


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>Document</title> </head> <body> </body> </html>
html:xs

Alias of !!!xs+doc4[xmlns=http://www.w3.org/1999/xhtml xml:lang=￥{lang}]


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>Document</title> </head> <body> </body> </html>
html:xxs

Alias of !!!xxs+doc4[xmlns=http://www.w3.org/1999/xhtml xml:lang=￥{lang}]


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>Document</title> </head> <body> </body> </html>
html:5

Alias of !!!+doc[lang=￥{lang}]


<!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>Document</title> </head> <body> </body> </html>
ol+

Alias of ol>li


<ol> <li></li> </ol>
ul+

Alias of ul>li


<ul> <li></li> </ul>
dl+

Alias of dl>dt+dd


<dl> <dt></dt> <dd></dd> </dl>
map+

Alias of map>area


<map name=""> <area shape="" coords="" href="" /> </map>
table+

Alias of table>tr>td


<table> <tr> <td></td> </tr> </table>
colgroup+， colg+

Alias of colgroup>col


<colgroup> <col /> </colgroup>
tr+

Alias of tr>td


<tr> <td></td> </tr>
+

Alias of >option


< name="" id=""> <option value=""></option> </>
optgroup+， optg+

Alias of optgroup>option


<optgroup> <option value=""></option> </optgroup>
!!!
<!doctype html>
!!!4t
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
!!!4s
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
!!!xt
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
!!!xs
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
!!!xxs
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
c
<!-- ￥{child} -->
cc:ie6
<!--[if lte IE 6]> ￥{child} <![endif]-->
cc:ie
<!--[if IE]> ￥{child} <![endif]-->
cc:noie
<!--[if !IE]><!--> ￥{child} <!--<![endif]-->

visual studio code快速生成Html头部信息和炫酷的代码补全

标签：

原文地址：http://www.cnblogs.com/jresun/p/5529536.html
踩
(0)
赞
(0)
   
举报
评论 一句话评论（0）
登录后才能评论！
分享档案
更多>
2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)
周排行
mamicode.com排行更多图片
更多
友情链接
兰亭集智   国之画   百度统计   站长统计   阿里云   chrome插件   新版天听网
关于我们 - 联系我们 - 留言反馈
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码！