首页 > 其他分享 >html标签的快捷

html标签的快捷

时间:2024-06-05 17:14:33浏览次数:8  
标签:标签 li ul html 快捷 使用 操作符 div

 

html标签的快捷录入方式

一:

<ul>
    <li><a href=""></a></li>
</ul> 如果要写上面的标签,直接写

##ul>li>a 然后按Tap键盘,就可以快速构建

  

二:

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

  

ul>(li>a)*3 然后按Tap键,就可以快速撰写

三:同时还可以给标签添加属性:

ul>(li>a[#])*3 然后按Tap键,就可以快速撰写

四:不同的属性:

ul>(li>a[click="#"])*3

五. 父子关系:>,使用>操作符在内部相互嵌套的标签:

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

  

六.:兄弟关系:+,使用+操作符将标签处于同一个层级:

七:生成兄弟关系时,像ul dl这样的列表标签,使用+操作符将生成一个标准的列表结构:

八: 上级关系:^,使用 ^ 操作符使标签与前一标签的父级处于相同的级别:

 


使用两^操作符就与前一标签的爷爷级是相同级别,依此类推:

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

  

九: 乘法:,使用操作符可以输出多个标签:

十: 分组:(),用()操作符进行分组,使编写的代码结构更加清晰、明了,一组标签就相当一个元素:

你可以使用多个(),并使用乘法*操作符:

CSS选择器,给标签指定id和class选择器,只需在标签的后面直接添加,但必需以.或#开头:

Emmet默认的标签是div,所以我们在写带有CSS选择器的div标签时,可以省去div,你可以试试。

十一:自定义属性:[](英文下的中括号),使用[]操作符给标签添加自定义属性:

可以把你喜欢的一些属性放在[]内,如果不指定属性值,代码将生成不带属性值的HTML默认标签:

td[colspan title]

属性值必需使用单引号或双引号,不然就会出现你可能想到的效果。

十二:. 项目编号:,使用∗可以重复的标签,,使用∗可以重复的标签,可以使标签生成有序列表,输出的值为数字:

除了生成无序列表,其它的标签也是一样:

你也可以使用多个$操作符用0(零)来分填充数字:

十二:. 更改列表的起始数字与顺序,看下面的代码就一目了然:数字的倒序,只需在前添加@-:*

起始数字,在前添加@起始数字:*

而从起始数字为3的列表倒序,只需把上面的Emmet代码item后面的数字写成@-3*5。

十三:. 文本:{},使用花括号来添加文本元素:

注意:当{}作为单独的一个操作符使用时,a{click}和a>{click}将生成相同的标签,但当使用了多个,或用了其它操作符时将会生成不同的标签:



作者:YU不忘初心
链接:https://www.jianshu.com/p/d0188312a14d
来源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

标签:标签,li,ul,html,快捷,使用,操作符,div
From: https://www.cnblogs.com/dontbealarmedimwithyou/p/18233364

相关文章

  • ASP.NET Core应用程序9:使用内置的标签助手
      ASP.NETCore提供了一组内置的标签助手,可以应用最常用的元素转换。使用了内置的标签助手,就不必像前一章一样自己创建自定义标签助手。  本章描述了基本的内置标签助手,并解释了它们是如何用于转换锚、链接、脚本和图像元素的。还解释了如何缓存内容部分以及如何根据应用程......
  • html生成wrod文档,并智能生成目录
    注意:首页网页标签不要有h1等标签,不然会生成目录使用的是Aspose.WordsDocumentdoc=newDocument();DocumentBuilderbuilder=newDocumentBuilder(doc);builder.InsertHtml(temHtml);if(isCatalogue){......
  • pdf文件可以转成html网页吗?
    目前我们工作或学习中使用最多的可能就是PDF格式的文档了,它虽然有很多好处,但是有时如果文档比较大,传送就比较麻烦,这时我们将其转换成HTML再发送就很方便了。那么pdf格式怎么转html格式呢?方法一、使用在线pdf转html如果不想下载软件的话,一些在线工具例如smallpdf中文版、speedpdf......
  • vue中将html导出成pdf
    vue中将页面html内容导出成pdf文件格式,使用 html2canvas、jspdf。首先使用 html2canvas将内容转换为图片,之后写入pdf。1、引用第一个.将页面html转换成图片npminstall--savehtml2canvas第二个.将图片生成pdfnpminstalljspdf--save2、创建  exportTo......
  • Zebra 打印机模板实现模板标签打印
    BrowserPrintUserGuide(zebra.cn)好久没有这么专注的研究过一个东西了,当研究出来后久违的满足感!最近项目中需要用到标签打印,虽然与打印机的接口由其他设备外包商承接,但打印机型号的采购还是需要我们自己选择,且承包商也不愿做复杂的通讯接口,所以才有了后来的研究,项目为了保......
  • 交互式流程图组件DHTMLX Diagram v6.0 - 拥有更灵活的高度可定制功能
    DHTMLXDiagram库允许用几行代码构建JavaScript流程图,通过自动布局和实时编辑器,它可以更容易地将复杂数据可视化到一个整洁的层次结构中。DHTMLXDiagramv6.0版本发布,带来了众多令人兴奋的新功能和改进,使得这个JavaScript图表库更加强大和灵活。此次更新不仅增强了现有的功能......
  • 前端引入,Web服务器的本质,HTTP协议,HTML基础,常用标签介绍
    Ⅰ前端引入【一】前端/后端【1】什么是前端任何与用户直接打交道的操作界面都可以称之为前端前端可以是浏览器的界面、也可以是客户端的界面、还可以是手机的界面...比如电脑界面、手机界面、平板界面【2】什么是后端不直接与用户打交道的用于执行真正业务逻辑的代......
  • 大学生HTML期末大作业——HTML+CSS+JavaScript美食网站(甜品)
    HTML+CSS+JS【美食网站】网页设计期末课程大作业web前端开发技术web课程设计网页规划与设计......
  • 大学生HTML期末大作业——HTML+CSS+JavaScript个人网站(图书爱好)
    HTML+CSS+JS【个人网站】网页设计期末课程大作业web前端开发技术web课程设计网页规划与设计......
  • B站快捷键
    Q点赞(长按3s一键三连)W投币E收藏D开关弹幕F开关全屏Esc退出全屏M开关静音左右方向键拖动进度条(长按倍速播放/回退)上下方向键调节音量Space暂停/继续播放shift+11倍速播放shift+22倍速播放Enter发送弹幕[]上一P/下一P......