Brackts

軟件簡介：

Brackets 是一個免費、開源且跨平臺的 HTML/CSS/Javas cript 前端 WEB 集成開發(fā)環(huán)境 (IDE工具)。該項目由Adobe 創(chuàng)建和維護，根據(jù)MIT許可證發(fā)布，支持 Windows、Linux 以及 OS X 平臺。

Brackets 的特點是簡約、優(yōu)雅、快捷！它沒有很多的視圖或者面板，也沒太多花哨的功能，它的核心目標是減少在開發(fā)過程中那些效率低下的重復性工作，例如瀏覽器刷新，修改元素的樣式，搜索功能等等。和 Sublime Text、Everedit 等通用代碼編輯器不一樣，Brackets 是專門針對 WEB 前端開發(fā)而生……

本文章適合已經(jīng)了解過軟件特點，但還未使用熟練的人，其實我也才用一個星期；

使用技巧：

常用快捷鍵：

       Ctrl/Cmd+Shift+H：呼出與關閉文件樹

       Ctrl/Cmd + E：(“編輯”)或退出css快捷編輯

       Ctrl/Cmd + +/- 放大縮小編輯區(qū)字體大小

       Ctrl/Cmd + 0 重置編輯區(qū)字體大小

       Ctrl/Cmd + Alt + P 打開即時預覽功能

       Ctrl/Cmd + / 行注釋

       Ctrl/Cmd + Alt + / 塊注釋

常用插件：

h)Brackets Beautify：快速格式話html和css代碼，十分對其工整；快捷鍵：ctrl+shift+l

i)Brackets CSS Class Code hint：自動收索css文件中的class和id名，直接在主面板提示出來，非常方便bootstrap開發(fā)

j)Emmet：快捷寫代碼，從此輕功再未落地；例：輸入”div.header“+tab；輸出<div class=”header”></div>

k)Extract for Brackets (Preview):直接在brackets中瀏覽psd文件，且自動識別，寬高，字體大小，讓你代碼都不用寫；（最大只支持16m；）

已知bug

l)css不能繼承選擇，只能手動繼承選擇，尤其是你需要寫<h3><p>之類標簽的樣式時

m)寫背景css時需要敲background-image：+url（）+../images;否則瀏覽期自動刷新會顯示，但是你用瀏覽器獨立瀏覽時不顯示背景圖片；原因是沒打前面兩個點

n)部分標簽不提示，例：hover;solid;你需要自己去敲完整；