1.编译软件-Vscode（附加背景设置）

常言道，工欲善其事必先利其器，web前端开发，一个趁手的软件必不可少。市面上的html编译软件有很多，但就我自己来讲，用的最顺手的就是Vscode，那么为什么会选择它呢，优点有：轻量、免VPN式的拓展安装、合理的工具栏、方便快捷的操作方式以及美观的界面（懂的都懂）。

---

1.软件下载

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

 选择相应的版本下载。

2.安装步骤

1）同意此条款

 2）选择合适的地方安装

 3）这里下一步就行

 4）这里要提示一下

1、通过code 打开“操作添加到windows资源管理器文件上下文菜单 ：把这个两个勾选上，可以对文件使用鼠标右键，选择VSCode 打开。
2、将code注册为受支持的文件类型的编辑器：不建议勾选，这样会默认使用VSCode打开支持的相关文件，文件图标也会改变。
3、添加到PATH（重启后生效）：建议勾选，可以使用控制台打开VSCode 。

 

 5）点安装，然后等他安装完就可以了

---

3.中文包拓展安装

安装完打开软件以后的界面就是这个样子啦，然后根据下图指示进行中文包安装，最后重启软件就ok了。

---

4.加菜区-编译器背景设置

1）安装拓展

2）设置属性 

 3）重要参数讲解

注意：首行"background.customImages": [

"为图片地址，一定要准确，推荐右键图片，选择属性，直接把地址复制过来"

]

 4）以防有的同学没有代码，这里附上代码（前段时间搞了搞PHP作业，所以最后的PHP就不用管了）

 

{
    
    "background.customImages": [

        "file:///C:/Users/lenovo/Desktop/022.jpeg"
    ],
    "background.style": {

        "content":"''",
        "pointer-events":"none",
        "position":"absolute",
        "width":"100%",
        "height":"100%",
        "z-index":"99999",
        "background.repeat":"no-repeat",
        "background-position":"center",
        "background-size":"160%,160%",
        "opacity":0.2 
    },
    "background.useFront": true,
    "background.useDefault": false,
    "workbench.colorTheme": "SynthWave '84",
    "window.zoomLevel": 2,
    "emmet.includeLanguages": {
        "{\"editor.formatOnType\":": "\"true\"}",
        "{\"editor.formatOnSave\":": "\"true\"}"
    },
    "explorer.confirmDragAndDrop": false,
    "bracket-pair-colorizer-2.activeScopeCSS": [
    

        "borderStyle : solid",
        "borderWidth : 1px",
        "borderColor : {color}",
        "opacity: 0.5"
    ],
    "editor.renderControlCharacters": true,
    "files.autoSave": "onFocusChange",
    "open-php-html-js-in-browser.documentRootFolder": "F:/bbxx/PHPstudy/PHP/phpstudy_pro/WWW",
    "open-php-html-js-in-browser.selectedBrowser": "Chrome",

}

---

今天就写到这里，生命不息！学习不止！键盘敲烂！月薪过万！加油，代码人