Sublime Text 2 Emmet插件常用快捷键

最新推荐文章于 2024-07-25 08:14:42 发布

wiflsnmo

最新推荐文章于 2024-07-25 08:14:42 发布

阅读量395

点赞数

文章标签： html5 css 插件

本文链接：https://blog.csdn.net/wiflsnmo/article/details/50847748

版权

简介

Emmet的前身是大名鼎鼎的Zen coding，如果你从事Web前端开发的话，对该插件一定不会陌生。它使用仿CSS选择器的语法来生成代码，大大提高了HTML/CSS代码编写的速度

使用

1.初始化
!+tab

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

</body>
</html>

2.生成多个元素如div*10+tab

<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>

3.生成子元素如div>ul>li*5>a+tab

<div>
    <ul>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
    </ul>
</div>

4.生成同级别元素如div>div+ul +tab

<div>
    <div></div>
    <ul></ul>
</div>

5.生成带id或class元素
如div#box+tab

<div id="box"></div>

div.box+tab

<div class="box"></div>

6.定义HTML元素的内容和属性
如输入h1{foo}和a[href=#]

<h1>foo</h1>
<a href="#"></a>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

wiflsnmo

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Sublime Text 2 Emmet插件常用快捷键

简介Emmet的前身是大名鼎鼎的Zen coding，如果你从事Web前端开发的话，对该插件一定不会陌生。它使用仿CSS选择器的语法来生成代码，大大提高了HTML/CSS代码编写的速度使用1.初始化 html5+tab<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</tit
复制链接

扫一扫