网页制作(HTML5+CSS3) 课件ch04编码加速器-Emmet语法_第1页
网页制作(HTML5+CSS3) 课件ch04编码加速器-Emmet语法_第2页
网页制作(HTML5+CSS3) 课件ch04编码加速器-Emmet语法_第3页
网页制作(HTML5+CSS3) 课件ch04编码加速器-Emmet语法_第4页
网页制作(HTML5+CSS3) 课件ch04编码加速器-Emmet语法_第5页
已阅读5页,还剩10页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

编码加速器-Emmet语法网页制作(HTML5+CSS3)什么是Emmet Emmet是一款支持常用编辑器的插件,该插件可以快速提升HTML和CSS工作效率 EmmetisapluginformanypopulartexteditorswhichgreatlyimprovesHTML&CSSworkflow下载地址 http://emmet.io/Emmet简介生成html格式html:5生成HTML代码框架输入div.container生成HTML带有DOM导航的链式缩写>子节点:在DOM树下一层添加创建一个元素+同级别:在DOM树同一层添加创建一个元素^向上层:向上一层添加创建创建一个元素。What‘sthemeaning?使用分组来简化你的代码结构有的时候你可能会发现使用向上符号比较复杂,这时候可能使用分组更加的合理。插入文本和属性如果你需要生成HTML,内容和属性也是你常常需要添加的。很多开发人员只是使用Emmet来生成框架,然后再添加内容。其实你可以在生成页面框架的过程中同时添加属性和内容。从下面代码可以看到,你输入的文字和属性都可以分别通过大括号和中括号来生成。添加多个class到一个元素只需要使用逗号来添加多个class重复添加自动列表记数如需要按顺序生成HTML元素,可使用$符号可以帮助生成一系列数字,支持class,id,属性,内容等等测试文本和测试标题使用lorem生成测试文本生成测试文本LoremIpsumDemo在编写HTML代码时,有时需要添加一些内容,Emmet提供了一段随机的看不懂的英文字段,作为测试数据我们就可以调用。而生成LoremIpsum文本也非常简单,输入lorem,按Tab键,就可以生成下面这段文字:Lorem

ipsum

dolor

sit

amet,

consectetur

adipisicing

elit.

Velit,

non,

minima,

voluptas

ducimus

voluptatem

perspiciatis

id

delectus

maiores

saepe

porro

aliquam

sunt

pariatur

eaque.

Enim,

voluptatem

nesciunt

voluptate

ad

veritatis.测试文本和测试标题使用lorem4生成测试标题使用lorem默认生成30个单词的文本,可以为它指定单词的数量来随机生成一大段文本例如:h2>lorem4<h2>Lorem

ipsum

dolor

sit.</h2>

再如:p*4>lorem4<p>Lorem

ipsum

dolor

sit.</p>

<p>Dolores,

similique

veritatis

reprehenderit.</p>

<p>Cupiditate

repudiandae

numquam

earum.</p>

<p>Atque,

sequi

autem

praese

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论