VScode的安装和配置

VScode的安装和配置

1. 下载和安装

下载地址：Download Visual Studio Code - Mac, Linux, Windows

2. 安装插件

1. Chinese (中文简体插件)

2. 设置>颜色主题 （可以自己定义想要的主题）

3. 设置>文件图标主题>安装其他主题

   Material Icon Theme（插件，为文件图标）

4. Auto Rename Tag (标签自动修改，保持头标签和结束标签一样)

5. carbon-now-sh (将代码生成一张图片)

   CTRL + shift +P 调出命令托盘

   输入 Carbon ，回车

6. Prettier - Code formatter (格式化代码)

   设置>搜索save>勾选

使用：在文件里面右键，使用格式化文档，选中Prettier - Code formatter

7. JetBrainsMono字体下载

   JetBrains Mono: A free and open source typeface for developers | JetBrains: Developer Tools for Professionals and Teams

   下载之后安装字体：

   解压>打开ttf文件夹>全选右击>安装

   配置字体

   设置>常用设置

8. 光标丝滑

   设置>文本编辑器>控制是否启用平滑插入动画

9. 搜索滚动

   用滚轮控制字体大小

3. 快捷键

注释：ctrl+/

移动行：alt + up/down

控制台：ctrl + ~

多行编辑：ctrl + alt + up/down

4. Emmet语法

1带有层级结构的：ul>li
2 
3     

4         

5     

1 代码在同级的：ul+li
2 
3     

4     

1 在上级的：ul>li^bq(这个可以多个^一起写)
2 
3     

4         

5     
6     

1 乘号批量复制：ul>li*3
2     
3     

4         

5         

6         

7     

1 创建带有指定class样式的标签：div.box
2 
3     

1 创建带有指定id样式的标签：div#box
2 
3     

 1 自定义属性内容：ul>li>a[href='#']
 2 
 3     

 4         

 5             
 6         
 7     

1 文本内容填充：a{首页}
2     
3     首页

 1 $符号自增
 2 
 3     ul>li.$*3
 4     

 5         

 6         

 7         

 8     
 9     
10     ul>li{第$$条项目}*3
11     

12         
第01条项目
13         
第02条项目
14         
第03条项目
15