CSS是用來美化網頁的樣式表語言,對于開發者來說是必不可少的。在許多代碼編輯器中,都有一個很有用的功能,那就是代碼提示。這個功能可以幫助開發者更加高效地編寫CSS代碼,下面將介紹如何在代碼編輯器中打開這個功能。
首先,我們需要選用具有代碼提示的代碼編輯器。目前很多主流的代碼編輯器都支持CSS代碼提示,例如:Visual Studio Code、Sublime Text、Atom等等。在這里我們以Visual Studio Code為例。
打開Visual Studio Code之后,先打開一個CSS文件。接著按下CTRL+SHIFT+P(Windows系統)或CMD+SHIFT+P(Mac系統),彈出命令面板,輸入“settings.json”,并打開該文件。這時會看到類似如下的代碼:
不同的代碼編輯器其代碼打開方式不一定相同,但找到相應的代碼設置文件后就可以開始下一步了。
我們需要在代碼設置文件中添加以下代碼:
這樣CSS代碼提示功能就啟用了。接著我們在編寫CSS代碼時,只需要在代碼編輯器中輸入首字母,就可以彈出相關的提示列表。例如輸入“b”,就可以出現相應的列表,包括“border”、“background”等等,非常方便。
在代碼編輯器中打開CSS代碼提示功能,可以大大提高編碼效率。建議每個開發者都嘗試一下,感受一下這個實用的功能帶來的便利。
首先,我們需要選用具有代碼提示的代碼編輯器。目前很多主流的代碼編輯器都支持CSS代碼提示,例如:Visual Studio Code、Sublime Text、Atom等等。在這里我們以Visual Studio Code為例。
打開Visual Studio Code之后,先打開一個CSS文件。接著按下CTRL+SHIFT+P(Windows系統)或CMD+SHIFT+P(Mac系統),彈出命令面板,輸入“settings.json”,并打開該文件。這時會看到類似如下的代碼:
{ "workbench.iconTheme": "vscode-icons", "editor.fontFamily": "Monaco", "editor.fontSize": 14, }
不同的代碼編輯器其代碼打開方式不一定相同,但找到相應的代碼設置文件后就可以開始下一步了。
我們需要在代碼設置文件中添加以下代碼:
"emmet.includeLanguages": { "css": "css" }
這樣CSS代碼提示功能就啟用了。接著我們在編寫CSS代碼時,只需要在代碼編輯器中輸入首字母,就可以彈出相關的提示列表。例如輸入“b”,就可以出現相應的列表,包括“border”、“background”等等,非常方便。
在代碼編輯器中打開CSS代碼提示功能,可以大大提高編碼效率。建議每個開發者都嘗試一下,感受一下這個實用的功能帶來的便利。
上一篇jquery貪吃蛇源碼
下一篇jquery跑馬燈表格