摘要:介紹是許多流行文本編輯器的插件,它極大地改進(jìn)了和工作流程為大部分流行的編輯器都提供了安裝插件,核心是縮寫語法鍵不同編輯器可自行設(shè)置,以下是我整理的常用知識(shí)點(diǎn)。
介紹:Emmet是許多流行文本編輯器的插件,它極大地改進(jìn)了HTML和CSS工作流程 、為大部分流行的編輯器都提供了安裝插件,核心是縮寫語法+tab鍵(不同編輯器可自行設(shè)置),以下是我整理的常用知識(shí)點(diǎn)。
一、特性1、支持定制:
添加新縮寫或更新現(xiàn)有縮寫,可修改snippets.json文件 更改Emmet過濾器和操作的行為,可修改preferences.json文件 定義如何生成HTML或XML代碼,可修改syntaxProfiles.json文件
2、支持大部分的編輯器:(此處無提供以下插件鏈接,附上官網(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二、基本語法
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>{請點(diǎn)擊 }+a{這里}+{ 跳轉(zhuǎn)}
三、HTML標(biāo)簽語法請點(diǎn)擊 這里 跳轉(zhuǎn)
1、所有未知的縮寫都會(huì)轉(zhuǎn)換成標(biāo)簽
2、基本html標(biāo)簽:!
Document
3、縮寫:link
4、簡寫:style、script
四、CSS語法1、值:p(%)、e(em)、x(ex) 、不寫默認(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)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://m.specialneedsforspecialkids.com/yun/113852.html
摘要:介紹是許多流行文本編輯器的插件,它極大地改進(jìn)了和工作流程為大部分流行的編輯器都提供了安裝插件,核心是縮寫語法鍵不同編輯器可自行設(shè)置,以下是我整理的常用知識(shí)點(diǎn)。 介紹:Emmet是許多流行文本編輯器的插件,它極大地改進(jìn)了HTML和CSS工作流程 、為大部分流行的編輯器都提供了安裝插件,核心是縮寫語法+tab鍵(不同編輯器可自行設(shè)置),以下是我整理的常用知識(shí)點(diǎn)。 一、特性 1、支持定制: ...
摘要:前端折騰記自從換了一個(gè)鍵盤之后,對的熱情遞增,終于找一個(gè)時(shí)間,靜下心來折騰一下,在下使用著實(shí)蛋疼,不過前端開發(fā)要求不高,之前用,其實(shí)也沒用到什么牛逼的插件,將就著用吧。 前端 window vim 折騰記 自從換了一個(gè)poker鍵盤之后,對vim的熱情遞增,終于找一個(gè)時(shí)間,靜下心來折騰一下vim,在window下使用vim著實(shí)蛋疼,不過前端開發(fā)要求不高,之前用sublime,vscod...
摘要:如果想配置開發(fā)工具面向前端及開發(fā)人員的配置如果想配置開發(fā)工具配置及使用技巧所謂網(wǎng)紅編輯器,我覺得比來的更爽,因?yàn)榈乃胁僮骱筒寮瑢τ趤碚f也就是一個(gè)插件就能無縫兼容。作為一個(gè)前端開發(fā),開箱即用的代碼編輯高亮提示都十分友好。 如果想配置 sublime 開發(fā)工具 => 面向web前端及node開發(fā)人員的vim配置 如果想配置 vim 開發(fā)工具 => sublime配置及使用技巧 所謂網(wǎng)紅...
摘要:之后,在終端輸入如果你需要支持,安裝支持到這里還沒有完,作為前端人,這個(gè)還不能正常工作,它需要一些依賴,下面我們來安裝這些依賴安裝查看回到目錄安裝之后需要在您的項(xiàng)目根目錄建立一個(gè)文件,沒有內(nèi)容,空白即可。 鑒于 window 下基本用不到 vim,所以下面內(nèi)容不再提及 window,具體可以在相應(yīng) github 中查看手冊操作基礎(chǔ):已裝有上有 nodejs(npm)。沒裝的可以移步官網(wǎng)...
摘要:之后,在終端輸入如果你需要支持,安裝支持到這里還沒有完,作為前端人,這個(gè)還不能正常工作,它需要一些依賴,下面我們來安裝這些依賴安裝查看回到目錄安裝之后需要在您的項(xiàng)目根目錄建立一個(gè)文件,沒有內(nèi)容,空白即可。 鑒于 window 下基本用不到 vim,所以下面內(nèi)容不再提及 window,具體可以在相應(yīng) github 中查看手冊操作基礎(chǔ):已裝有上有 nodejs(npm)。沒裝的可以移步官網(wǎng)...
閱讀 1677·2021-11-17 09:33
閱讀 3541·2021-11-16 11:40
閱讀 3063·2019-08-30 11:23
閱讀 1055·2019-08-29 16:36
閱讀 2472·2019-08-29 13:23
閱讀 1746·2019-08-29 12:59
閱讀 1549·2019-08-29 12:42
閱讀 1986·2019-08-28 18:22