免费在线,久久aⅴ乱码一区二区三区

軟件介紹

Emmet LiveStyle對(duì)于很多開發(fā)CSS朋友一定是非常熟悉了。是一個(gè)非常高效的CSS前端瀏覽器插件。功能非常全面，能夠大大的提高前端CSS開發(fā)的效率。其實(shí)最早是sublime的插件，功能功能的強(qiáng)大。對(duì)于本地開發(fā)的朋友可以試試，運(yùn)行效果更加的強(qiáng)大。而目前的這個(gè)Emmet LiveStyle則是專門為瀏覽器設(shè)計(jì)的。

軟件功能

1、即時(shí)更新(不會(huì)重新加載頁面，樣式修改以后無需保存也能預(yù)覽);;

2、多個(gè)頁面同時(shí)預(yù)覽(例：同時(shí)打開多個(gè)頁面，并且關(guān)聯(lián)到相同的CSS，此時(shí)修改該CSS，這些頁面都能即時(shí)顯示修改內(nèi)容);

3、雙向修改(在Chrome開發(fā)者工具和Sublime Text中，只要有一處修改，兩個(gè)工具的樣式都會(huì)更改。)

4、便捷的安裝和使用。

使用方法

安裝瀏覽器擴(kuò)展程序：

安裝好后，會(huì)出現(xiàn)下面這個(gè)圖標(biāo),點(diǎn)擊后會(huì)出現(xiàn)如下圖所示。這個(gè)時(shí)候還是不能用的，因?yàn)槲覀冞€沒在sublime里安裝emmet livestyle。二者還沒關(guān)聯(lián)起來。接下來，開始闡述如何安裝emmet livestyle。

Emmet

首先安裝Subliem Text插件，確保有sublime->preferences->package control選項(xiàng)。如果有的話下一步，沒有的話請(qǐng)自行百度下，網(wǎng)上很多相關(guān)資料。接著點(diǎn)擊package control，輸入install Package ，然后過會(huì)兒會(huì)彈出框，輸入livestyle。

（1)LiveStyle和Emmet(用來補(bǔ)全代碼)一樣，需要PyV8插件的支持。建議先安裝Emmet，因?yàn)榘惭bEmmet的同時(shí)會(huì)自動(dòng)安裝PyV8。

（2)如果sublime的LiveStyle安裝好后，但仍然打開google的livestyle顯示不了，如果你的sublime是破解碼的，建議卸載掉，然后去官網(wǎng)下載sublime3.重新安裝Emmet和livestyle。

（3)安裝Emmet的過程中，如果出現(xiàn)PyV8安裝不成功，sublime出現(xiàn)下圖，那么可以通過復(fù)制該鏈接下載Pyv8。

Emmet

（4)把下載的文件解壓后放到以下目錄。

C:UsersAdministratorAppDataRoamingSublime Text 3Installed PackagesPyV8。

如果沒有PyV8這個(gè)目錄的話就新建一個(gè)。

最終就是這樣一個(gè)目錄

C:UsersAdministratorAppDataRoamingSublime Text 3Installed PackagesPyV8pyv8-win64-p3。

Emmet

上面步驟都弄好后，就可以打開google里的livestyle啦。如下圖，檢測(cè)到包含了global.css和login.css。如果想要在線更改global.css，選擇三角形箭頭選擇對(duì)應(yīng)的css文件即可。在google的開發(fā)者工具調(diào)試代碼后，打開sublime即可發(fā)現(xiàn)光標(biāo)已經(jīng)定位到修改的內(nèi)容，若此時(shí)保存sublime里的文件，則可以永久保存。

注：此時(shí)Chrome的Matched CSS Rules和Sublime Text的修改都會(huì)雙向同步。

Emmet