摘要:介紹是許多流行文本編輯器的插件,它極大地改進(jìn)了和工作流程為大部分流行的編輯器都提供了安裝插件,核心是縮寫(xiě)語(yǔ)法鍵不同編輯器可自行設(shè)置,以下是我整理的常用知識(shí)點(diǎn)。
介紹:Emmet是許多流行文本編輯器的插件,它極大地改進(jìn)了HTML和CSS工作流程 、為大部分流行的編輯器都提供了安裝插件,核心是縮寫(xiě)語(yǔ)法+tab鍵(不同編輯器可自行設(shè)置),以下是我整理的常用知識(shí)點(diǎn)。
一、特性1、支持定制:
添加新縮寫(xiě)或更新現(xiàn)有縮寫(xiě),可修改snippets.json文件 更改Emmet過(guò)濾器和操作的行為,可修改preferences.json文件 定義如何生成HTML或XML代碼,可修改syntaxProfiles.json文件
2、支持大部分的編輯器:(此處無(wú)提供以下插件鏈接,附上官網(wǎng)鏈接:https://www.emmet.io/)
Sublime Text 3/2 TextMate 1.x Eclipse/Aptana Coda 1.6 and 2.x Espresso Chocolat Komodo Edit/IDE Notepad++ PSPad二、基本語(yǔ)法
1、后代:> 示例:div>ul>li>a
2、兄弟:+ 示例:h1+p
3、上級(jí):^ ^^ 示例:div>ul>li>span+a^p div>ul>li>span+a^^p
4、分組:() 示例:div>(header>ul>li*2>a)+footer>div
5、乘法: 示例:ul>li2
6、自增減:$ 示例:ul>li.lis$3 ul>li.lis$@-*3 div>h$[title=th$]{Header$}3
7、命名、屬性:#head .head p.p1.p2.p3
8、自定義屬性:[] 示例div[title="HelloWorld"] div[rowspan=2 colspan=3 title]
9、文本:{} 示例:div>{請(qǐng)點(diǎn)擊 }+a{這里}+{ 跳轉(zhuǎn)}
三、HTML標(biāo)簽語(yǔ)法請(qǐng)點(diǎn)擊 這里 跳轉(zhuǎn)
1、所有未知的縮寫(xiě)都會(huì)轉(zhuǎn)換成標(biāo)簽
2、基本html標(biāo)簽:!
Document
3、縮寫(xiě):link
4、簡(jiǎn)寫(xiě):style、script
四、CSS語(yǔ)法1、值:p(%)、e(em)、x(ex) 、不寫(xiě)默認(rèn)px、 如w100
width:100px;
2、附加屬性:@f:
@font-face {
font-family:; src:url();
}
3、模糊匹配:ov:h、ov-h、ovh、oh
overflow:hidden;
4、供應(yīng)商前綴:trs
-webkit-transition: prop time; -moz-transition: prop time; -ms-transition: prop time; -o-transition: prop time; transition: prop time;
5、漸變:lg(left,yellow 50%,@pink)
background-image: -webkit-linear-gradient(left, yellow 50%, @pink); background-image: -o-linear-gradient(left, yellow 50%, @pink); background-image: linear-gradient(to right, yellow 50%, @pink);
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://m.hztianpu.com/yun/54588.html
摘要:介紹是許多流行文本編輯器的插件,它極大地改進(jìn)了和工作流程為大部分流行的編輯器都提供了安裝插件,核心是縮寫(xiě)語(yǔ)法鍵不同編輯器可自行設(shè)置,以下是我整理的常用知識(shí)點(diǎn)。 介紹:Emmet是許多流行文本編輯器的插件,它極大地改進(jìn)了HTML和CSS工作流程 、為大部分流行的編輯器都提供了安裝插件,核心是縮寫(xiě)語(yǔ)法+tab鍵(不同編輯器可自行設(shè)置),以下是我整理的常用知識(shí)點(diǎn)。 一、特性 1、支持定制: ...
摘要:前端折騰記自從換了一個(gè)鍵盤(pán)之后,對(duì)的熱情遞增,終于找一個(gè)時(shí)間,靜下心來(lái)折騰一下,在下使用著實(shí)蛋疼,不過(guò)前端開(kāi)發(fā)要求不高,之前用,其實(shí)也沒(méi)用到什么牛逼的插件,將就著用吧。 前端 window vim 折騰記 自從換了一個(gè)poker鍵盤(pán)之后,對(duì)vim的熱情遞增,終于找一個(gè)時(shí)間,靜下心來(lái)折騰一下vim,在window下使用vim著實(shí)蛋疼,不過(guò)前端開(kāi)發(fā)要求不高,之前用sublime,vscod...
摘要:如果想配置開(kāi)發(fā)工具面向前端及開(kāi)發(fā)人員的配置如果想配置開(kāi)發(fā)工具配置及使用技巧所謂網(wǎng)紅編輯器,我覺(jué)得比來(lái)的更爽,因?yàn)榈乃胁僮骱筒寮?,?duì)于來(lái)說(shuō)也就是一個(gè)插件就能無(wú)縫兼容。作為一個(gè)前端開(kāi)發(fā),開(kāi)箱即用的代碼編輯高亮提示都十分友好。 如果想配置 sublime 開(kāi)發(fā)工具 => 面向web前端及node開(kāi)發(fā)人員的vim配置 如果想配置 vim 開(kāi)發(fā)工具 => sublime配置及使用技巧 所謂網(wǎng)紅...
摘要:之后,在終端輸入如果你需要支持,安裝支持到這里還沒(méi)有完,作為前端人,這個(gè)還不能正常工作,它需要一些依賴,下面我們來(lái)安裝這些依賴安裝查看回到目錄安裝之后需要在您的項(xiàng)目根目錄建立一個(gè)文件,沒(méi)有內(nèi)容,空白即可。 鑒于 window 下基本用不到 vim,所以下面內(nèi)容不再提及 window,具體可以在相應(yīng) github 中查看手冊(cè)操作基礎(chǔ):已裝有上有 nodejs(npm)。沒(méi)裝的可以移步官網(wǎng)...
摘要:之后,在終端輸入如果你需要支持,安裝支持到這里還沒(méi)有完,作為前端人,這個(gè)還不能正常工作,它需要一些依賴,下面我們來(lái)安裝這些依賴安裝查看回到目錄安裝之后需要在您的項(xiàng)目根目錄建立一個(gè)文件,沒(méi)有內(nèi)容,空白即可。 鑒于 window 下基本用不到 vim,所以下面內(nèi)容不再提及 window,具體可以在相應(yīng) github 中查看手冊(cè)操作基礎(chǔ):已裝有上有 nodejs(npm)。沒(méi)裝的可以移步官網(wǎng)...
閱讀 2787·2023-04-25 17:58
閱讀 3046·2021-11-15 11:38
閱讀 2454·2021-11-02 14:48
閱讀 1265·2021-08-25 09:40
閱讀 1902·2019-08-30 15:53
閱讀 1165·2019-08-30 15:52
閱讀 1086·2019-08-30 13:55
閱讀 2510·2019-08-29 15:21