【04】emmet系列之编辑器_html/css_WEB-ITnose

php中文网
发布: 2016-06-24 11:34:11
原创
1577人浏览过

 

立即学习前端免费学习笔记(深入)”;

   【01】emmet系列之基础介绍

 

立即学习前端免费学习笔记(深入)”;

  【02】emmet系列之HTML语法

 

立即学习前端免费学习笔记(深入)”;

  【03】emmet系列之CSS语法

 

立即学习前端免费学习笔记(深入)”;

  【04】emmet系列之编辑器

 

立即学习前端免费学习笔记(深入)”;

  【05】emmet系列之各种缩写

 

立即学习前端免费学习笔记(深入)”;

前端开发人员,常用的是sublime和webstorm。

 

emmet在sublime上的效果:

1). css :他与其它编辑器的区别在于细节上,比如ctrl,alt+方向键可以修和里边的数值

AI图像编辑器
AI图像编辑器

使用文本提示编辑、变换和增强照片

AI图像编辑器 46
查看详情 AI图像编辑器

2). html 效果:

3). sublime的emmet规则修改:

packages->Emmet->emmet->snippets.json

 

立即学习前端免费学习笔记(深入)”;

emmet在webstorm上的效果:

只有一个例外jetbrain公司的产品线:webstorm,phpstorm,intellij idea都是内置的,不需要安装。

1).

写js的效果:

2). webstorm的emmet规则修改:Files -> settings -> Live Templates

 

定制 


你还可以定制Emmet插件: 

  • 添加新缩写或更新现有缩写,可修改snippets.json文件
  • 更改Emmet过滤器和操作的行为,可修改preferences.json文件
  • 定义如何生成HTML或XML代码,可修改syntaxProfiles.json文件

  • 针对不同编辑器的插件 


    Emmet支持的编辑器如下(链接为针对该编辑器的Emmet插件): 

  • Sublime Text 3/2
  • TextMate 1.x
  • Eclipse/Aptana
  • Coda 1.6 and 2.x
  • Espresso
  • Chocolat (通过“Install Mixin”对话框添加)
  • Komodo Edit/IDE (通过Tools → Add-ons菜单添加)
  • Notepad++
  • PSPad
  • CodeMirror2/3
  • Brackets
  • 在线编辑器的支持:

  •  JSFiddle
  •  JS Bin
  •  CodePen
  •  ICEcoder
  •  Divshot
  •  Codio
  • 第三方插件的支持

    下面这些编辑器的插件都是由第三方开发者所提供的,所以可能并不支持所有Emmet的功能和特性。

  •  SynWrite
  •  WebStorm
  •  PhpStorm
  •  Vim
  •  HTML-Kit
  •  HippoEDIT
  •  CodeLobster PHP Edition
  •  TinyMCE


  •  



    HTML速学教程(入门课程)
    HTML速学教程(入门课程)

    HTML怎么学习?HTML怎么入门?HTML在哪学?HTML怎么学才快?不用担心,这里为大家提供了HTML速学教程(入门课程),有需要的小伙伴保存下载就能学习啦!

    下载
    来源:php中文网
    本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
    最新问题
    开源免费商场系统广告
    热门教程
    更多>
    最新下载
    更多>
    网站特效
    网站源码
    网站素材
    前端模板
    关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
    php中文网:公益在线php培训,帮助PHP学习者快速成长!
    关注服务号 技术交流群
    PHP中文网订阅号
    每天精选资源文章推送
    PHP中文网APP
    随时随地碎片化学习

    Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号