北京总部

HTML模板引擎——Jade

作者: 来源: 时间: 2017-06-20 13:53:43

安装


  • 项目基于 gulp gulp-jade

  • 项目安装 npm install


用法

jade使用 缩进式 语法,剔除了html的尖括号<html></html>写法。

引用源码看下效果

//index.jade <!DOCTYPE html>
html(lang="en") head include tpl/meta title Document
body .content h2.title h2标签
    p.text p标签  // 引入list.jade  include tpl/list


  • 1.子元素换行,并缩进 两个 空格,或使用 : 连接子元素。


// 换行缩进方式 ul
  li // 以':'连接方式 ul: li // 编译结果 <ul>
  <li></li>
</ul>


  • class id 直接使用 . # 代替,可连写多个,中间 不需要 空格,div可以省略。


#content.wrapper // 编译结果 <div id="content" class="warpper"></div>


  • 属性使用() 紧跟 标签。


a(href='#') // 编译结果 <a href="#"></a>


  • 使用 include 引入代码块,.jade可以省略。




include tpl/list // 编译结果:引入tpl/list.jade文件,并编译成html。
 欢迎来到中软国际教育集团技术知识库,小卓与您共同学习,共同进步!



相关阅读

更多

中软卓越java培训地址:北京市海淀区科学院南路2号融科资讯中心C座北楼12层 联系电话:400-666-3775 邮箱账号:etc-marketing@chinasofti.com

©2008-2016 北京中软国际教育科技股份有限公司 京ICP备14058756号-2