版权声明:署名,允许他人基于本文进行创作,且必须基于与原先许可协议相同的许可协议分发本文 (Creative Commons)
1、快速生成头文件:html:5 按Tab
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Document</title>
</head>
<body>
</body>
</html>
2、引入样式文件:link: 按enter或Tab
<link rel="stylesheet" type="text/css" href="css/css1.css"/>
<link rel="stylesheet" href="" />
**引入js文件:script:src 按Tab**
<script src="js/script.js"></script>
3、输入标签名自动补齐 如:p 按 Tab
<p></p>
4、随机英文文本的输入
<h1>Lorem随机生成一段文本,默认30个单词</h1>
<div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Distinctio eius dolores enim accusantium modi atque minima libero harum animi nisi consequatur mollitia quis unde ut nesciunt ex ad a quidem.</div>
<h1>Lorem10生成是个单词</h1>
<div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officiis asperiores!</div>
<h1>Lorem*10生成十行</h1>
<div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quis harum suscipit natus deleniti praesentium facilis quia qui modi cum nostrum veniam ullam nihil officia repellat accusamus maiores nisi pariatur et.</div>
<div>Culpa vitae voluptatem sapiente facere reiciendis quam consequuntur illum ipsa dolorum a accusamus dolorem repudiandae dignissimos laborum aperiam maiores fugit quaerat exercitationem quidem porro corrupti veniam vero quas eaque maxime!</div>
<div>Eaque hic et voluptatum temporibus eius recusandae sit reprehenderit! Iste voluptate pariatur officia asperiores facilis porro unde molestias ex et id earum eligendi ratione corporis exercitationem velit minus saepe aliquam.</div>
<div>Ab accusantium laboriosam aspernatur deleniti enim quaerat ducimus consequuntur cum delectus dolorem incidunt id nihil. Natus unde amet nam non asperiores odit perspiciatis atque ratione similique provident ut veritatis dolores.</div>
<div>Sapiente dolores molestias iure sit quo quisquam tenetur commodi placeat veniam temporibus ab animi sed praesentium unde et! Et eaque nostrum cum provident expedita maiores mollitia aspernatur odit cupiditate saepe.</div>
<div>Non esse mollitia consequatur similique animi id quo nobis nam nisi ab quod atque saepe modi nostrum maxime veniam quidem eum repellendus pariatur officia. Fugit cupiditate ratione eveniet perspiciatis tempora?</div>
<div>Molestias rem necessitatibus nam at distinctio non perferendis quia dolore. Error libero odit repellat dolore labore velit numquam reprehenderit quibusdam tempora non? Veniam sunt in inventore dolor illo dignissimos iste.</div>
<div>Quia porro ipsum quod est odit necessitatibus amet consequuntur recusandae perspiciatis nihil commodi quidem nesciunt ea cupiditate quas eligendi enim dicta libero harum ipsam atque aut alias qui corrupti pariatur!</div>
<div>Vero placeat tenetur nam magnam ad porro facilis quis reiciendis repellat ipsa minus commodi mollitia necessitatibus aperiam accusamus cumque illum tempora odit reprehenderit qui quas inventore quasi in quaerat a.</div>
<div>Sequi minus labore velit ut fuga similique architecto. Dolor sed repudiandae neque nam optio odit autem natus voluptas ea libero pariatur quia asperiores sint molestias aspernatur beatae corporis? Ut magni.</div>
<h1>Lorem10*10生成十行每行十个单词</h1>
<div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Architecto id.</div>
<div>Cum consequatur dignissimos facilis quas alias quia quis aliquam ex.</div>
<div>Eaque odio quia provident consequatur delectus rem debitis laborum. Dolorum!</div>
<div>Atque soluta odit impedit ut in nesciunt magnam alias! Minus.</div>
<div>Velit laboriosam totam doloremque pariatur numquam soluta quam temporibus eveniet.</div>
<div>Eveniet impedit nam illo laboriosam iusto perspiciatis distinctio rerum vero!</div>
<div>Recusandae inventore beatae sequi ea aut accusamus vero consequuntur optio!</div>
<div>Quibusdam illo suscipit quisquam deleniti reiciendis error quae totam aliquam.</div>
<div>Mollitia numquam voluptatibus dolorem. Omnis facilis amet neque culpa quidem.</div>
<div>Maxime tempora voluptas at aliquid dolores id quasi laboriosam error.</div>
5、使用"#“输入id,”.“输入class,”[]"输入属性,{}输入数据内容
div#id.class[alt=属性]{数据}
<div id="id" class="class" alt="属性">输入数据内容</div>
6、使用">“输入嵌套标签,”+" 输入并列的兄弟标签,"^"上级元素
div>ul+ul^div
<div>
<ul></ul>
<ul></ul>
</div>
<div></div>
div>div#div>p^h1
<div>
<div id="div">
<p></p>
</div>
<h1></h1>
</div>
7、使用()对标签分组并生成多个标签
(div>div#id.class)(div>div#id.class)
<div>
<div id="id" class="class"></div>
</div>
<div>
<div id="id1" class="class"></div>
</div>
8、自增符号$
自增符号$
ul>li*3>[alt=$.img]
<ul>
<li>
<div alt="1.img"></div>
</li>
<li>
<div alt="2.img"></div>
</li>
<li>
<div alt="3.img"></div>
</li>
</ul>
ul>li*3>img[src=$.img][alt=img$]
<ul>
<li><img src="1.img" alt="img1" /></li>
<li><img src="2.img" alt="img2" /></li>
<li><img src="3.img" alt="img3" /></li>
</ul>
ul>li*3>img[src=$$img][alt=img$$$]
<ul>
<li><img src="01.img" alt="img001" /></li>
<li><img src="02.img" alt="img002" /></li>
<li><img src="03.img" alt="img003" /></li>
</ul>