如何使 VS Code 支援 CSS Intellisense ?

栏目: CSS · 发布时间: 6年前

内容简介:VS Code 預設並沒有支援 CSS Class 的 Intellisense,這使得 HTML 在套用 CSS Class 時很不方便,需要另外安裝VS Code 1.33.1HTML CSS Support 0.2.0

VS Code 預設並沒有支援 CSS Class 的 Intellisense,這使得 HTML 在套用 CSS Class 時很不方便,需要另外安裝 HTML CSS Support Extension。

Version

VS Code 1.33.1

HTML CSS Support 0.2.0

Bootstrap 4.3.1

HTML CSS Support

如何使 VS Code 支援 CSS Intellisense ?

另外安裝 HTML CSS Support

CSS Intellisense

CSS 就使用上,大概有 3 種情境:

*.min.css
*.css
*.min.css

對於前兩種狀況,HTML CSS Support 都可以直接抓到 CSS class 沒問題。

但對於第 3 種方式,就必須額外的設定。

Remote CSS

如何使 VS Code 支援 CSS Intellisense ?

在 command palette 下,輸入 json ,選擇 Preferences: Open Settings (JSON)

settings.json

"css.remoteStyleSheets": [
  "https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
]

新增 css.remoteStyleSheets ,在 array 內加入 Bootstrap 的 CDN。

如何使 VS Code 支援 CSS Intellisense ?

只是以 Bootstrap 為例,其他如 Font Awesome …等的 CDN 也適用

如何使 VS Code 支援 CSS Intellisense ?

Bootstrap 的 CSS class 出現了。

Conclusion

  • 加上 HTML CSS Support 之後,就可以在 VS Code 很開心地使用 CSS class 了

Reference

VS Code , HTML CSS Support


以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

Writing Apache Modules with Perl and C

Writing Apache Modules with Perl and C

Lincoln Stein、Doug MacEachern / O'Reilly Media, Inc. / 1999-03 / USD 39.95

Apache is the most popular Web server on the Internet because it is free, reliable, and extensible. The availability of the source code and the modular design of Apache makes it possible to extend Web......一起来看看 《Writing Apache Modules with Perl and C》 这本书的介绍吧!

RGB转16进制工具
RGB转16进制工具

RGB HEX 互转工具

Base64 编码/解码
Base64 编码/解码

Base64 编码/解码

UNIX 时间戳转换
UNIX 时间戳转换

UNIX 时间戳转换