@@ -100,12 +100,12 @@ <h1 itemprop="name headline">
100100 </ div >
101101 < div id ="imgs " class ="pjax ">
102102 < ul >
103- < li class ="item " data-background-image ="https://tva4 .sinaimg.cn/large/6833939bly1gicit31ffoj20zk0m8naf .jpg "> </ li >
104- < li class ="item " data-background-image ="https://tva4 .sinaimg.cn/large/6833939bly1giclgi503lj20zk0m8hdt .jpg "> </ li >
105- < li class ="item " data-background-image ="https://tva4 .sinaimg.cn/large/6833939bly1gipeun65urj20zk0m81ii .jpg "> </ li >
106- < li class ="item " data-background-image ="https://tva4 .sinaimg.cn/large/6833939bly1gicliwyw55j20zk0m8hdt .jpg "> </ li >
107- < li class ="item " data-background-image ="https://tva4 .sinaimg.cn/large/6833939bly1gipewkhf1zj20zk0m81kx .jpg "> </ li >
108- < li class ="item " data-background-image ="https://tva4 .sinaimg.cn/large/6833939bly1gicli9lfebj20zk0m84qp .jpg "> </ li >
103+ < li class ="item " data-background-image ="https://tva3 .sinaimg.cn/large/6833939bly1giclip4jbpj20zk0m87cv .jpg "> </ li >
104+ < li class ="item " data-background-image ="https://tva3 .sinaimg.cn/large/6833939bly1giclwuom7cj20zk0m8dvn .jpg "> </ li >
105+ < li class ="item " data-background-image ="https://tva3 .sinaimg.cn/large/6833939bly1giclfw2t96j20zk0m8x6p .jpg "> </ li >
106+ < li class ="item " data-background-image ="https://tva3 .sinaimg.cn/large/6833939bly1gicitzannuj20zk0m8b29 .jpg "> </ li >
107+ < li class ="item " data-background-image ="https://tva3 .sinaimg.cn/large/6833939bly1giclize41wj20zk0m87gk .jpg "> </ li >
108+ < li class ="item " data-background-image ="https://tva3 .sinaimg.cn/large/6833939bly1gipexoj0moj20zk0m8kgu .jpg "> </ li >
109109 </ ul >
110110 </ div >
111111 </ header >
@@ -149,30 +149,61 @@ <h1 itemprop="name headline">
149149 < div class ="body md " itemprop ="articleBody ">
150150
151151
152- < h2 id ="vscode设置Fira-Code字体及改变编辑器字体、背景颜色 "> < a href ="#vscode设置Fira-Code字体及改变编辑器字体、背景颜色 " class ="headerlink " title ="vscode设置Fira_Code字体及改变编辑器字体、背景颜色 "> </ a > vscode设置Fira_Code字体及改变编辑器字体、背景颜色</ h2 > < hr >
153- < h3 id ="一、设置Fira-Code字体 "> < a href ="#一、设置Fira-Code字体 " class ="headerlink " title ="一、设置Fira_Code字体 "> </ a > 一、设置Fira_Code字体</ h3 > < p > < strong > 1.下载字体</ strong > < br > 这里给出github下载链接，点击链接后在README.md中的Download & Install一栏中即可下载，链接中也包括字体示例及介绍，可自行查看。< br > < span class ="exturl " data-url ="aHR0cHM6Ly9naXRodWIuY29tL3RvbnNreS9GaXJhQ29kZQ== "> Fira_Code字体下载</ span > </ p >
154- < p > < strong > 2，安装字体</ strong > < br > 下载并解压，进入里面的ttf文件夹，双击或右击后点击安装，里面包含六种样式，可以选择性安装或全安装即可。</ p >
155- < p > < strong > 3，设置vscode</ strong > < br > 打开vscode，点击左下角齿轮形状图标，选择settings，得到下图所示界面：< br > < img data-src ="https://s1.ax1x.com/2020/07/12/U8toG9.jpg " alt ="U8toG9.jpg "> </ p >
156- < p > 根据上图箭头所示依次点击Font，Edit in settings.json，添加如下代码：</ p >
157- < figure class ="highlight plaintext "> < table > < tr > < td class ="gutter "> < pre > < span class ="line "> 1</ span > < br > < span class ="line "> 2</ span > < br > </ pre > </ td > < td class ="code "> < pre > < span class ="line "> "editor.fontFamily": "'Fira Code',Menlo, Monaco, 'Courier New', monospace",</ span > < br > < span class ="line "> "editor.fontLigatures": true,</ span > < br > </ pre > </ td > </ tr > </ table > </ figure >
152+ < h2 id ="vscode设置fira_code字体及改变编辑器字体-背景颜色 "> < a class ="anchor " href ="#vscode设置fira_code字体及改变编辑器字体-背景颜色 "> #</ a > vscode 设置 Fira_Code 字体及改变编辑器字体、背景颜色</ h2 >
153+ < hr />
154+ < h3 id ="一-设置fira_code字体 "> < a class ="anchor " href ="#一-设置fira_code字体 "> #</ a > 一、设置 Fira_Code 字体</ h3 >
155+ < p > < strong > 1. 下载字体</ strong > < br />
156+ 这里给出 github 下载链接，点击链接后在 README.md 中的 Download & Install 一栏中即可下载，链接中也包括字体示例及介绍，可自行查看。< br />
157+ < span class ="exturl " data-url ="aHR0cHM6Ly9naXRodWIuY29tL3RvbnNreS9GaXJhQ29kZQ== "> Fira_Code 字体下载</ span > </ p >
158+ < p > < strong > 2，安装字体</ strong > < br />
159+ 下载并解压，进入里面的 ttf 文件夹，双击或右击后点击安装，里面包含六种样式，可以选择性安装或全安装即可。</ p >
160+ < p > < strong > 3，设置 vscode</ strong > < br />
161+ 打开 vscode，点击左下角齿轮形状图标，选择 settings，得到下图所示界面：< br />
162+ < img data-src ="https://s1.ax1x.com/2020/07/12/U8toG9.jpg " alt ="U8toG9.jpg " /> </ p >
163+ < p > 根据上图箭头所示依次点击 Font，Edit in settings.json，添加如下代码：</ p >
164+ < pre > < code > "editor.fontFamily": "'Fira Code',Menlo, Monaco, 'Courier New', monospace",
165+ "editor.fontLigatures": true,
166+ </ code > </ pre >
158167< ul >
159- < li > 注：如果添加到{} 里的最后面，则需去掉true后面的逗号 </ li >
160- < li > 如果不想使用连字，则将true改为false (什么是连字可自行百度，这里举个例子，c语言中!= 使用连字后则会显示≠)</ li >
168+ < li > 注：如果添加到 {} 里的最后面，则需去掉 true 后面的逗号 </ li >
169+ < li > 如果不想使用连字，则将 true 改为 false (什么是连字可自行百度，这里举个例子，c 语言中！= 使用连字后则会显示≠)</ li >
161170</ ul >
162- < hr >
163- < h3 id ="二、设置字体颜色 "> < a href ="#二、设置字体颜色 " class ="headerlink " title ="二、设置字体颜色 "> </ a > 二、设置字体颜色</ h3 > < p > 可以通过更换主题来改变字体颜色，这里推荐几款比较经典的主题，供大家选择。</ p >
171+ < hr />
172+ < h3 id ="二-设置字体颜色 "> < a class ="anchor " href ="#二-设置字体颜色 "> #</ a > 二、设置字体颜色</ h3 >
173+ < p > 可以通过更换主题来改变字体颜色，这里推荐几款比较经典的主题，供大家选择。</ p >
164174< ul >
165175< li > One Dark Pro Italic</ li >
166176< li > Material Theme</ li >
167177< li > One Dark Pro</ li >
168178< li > Darker One</ li >
169179</ ul >
170- < p > 直接在vscode左侧Extensions中搜索安装即可使用，如果想要尝试其他主题，可输入 One 进行搜索，众多主题总有一款适合你。</ p >
171- < hr >
172- < h3 id ="三、设置编辑器背景颜色及光标所在行的颜色 "> < a href ="#三、设置编辑器背景颜色及光标所在行的颜色 " class ="headerlink " title ="三、设置编辑器背景颜色及光标所在行的颜色 "> </ a > 三、设置编辑器背景颜色及光标所在行的颜色</ h3 > < p > 之前习惯用黑色背景，可是改变主题后背景往往会发生改变，可以通过设置自定义背景颜色。< br > 按照上面的步骤打开settings.json，添加以下设置：</ p >
173- < figure class ="highlight plaintext "> < table > < tr > < td class ="gutter "> < pre > < span class ="line "> 1</ span > < br > < span class ="line "> 2</ span > < br > < span class ="line "> 3</ span > < br > < span class ="line "> 4</ span > < br > < span class ="line "> 5</ span > < br > < span class ="line "> 6</ span > < br > < span class ="line "> 7</ span > < br > < span class ="line "> 8</ span > < br > < span class ="line "> 9</ span > < br > < span class ="line "> 10</ span > < br > < span class ="line "> 11</ span > < br > < span class ="line "> 12</ span > < br > < span class ="line "> 13</ span > < br > < span class ="line "> 14</ span > < br > < span class ="line "> 15</ span > < br > < span class ="line "> 16</ span > < br > < span class ="line "> 17</ span > < br > </ pre > </ td > < td class ="code "> < pre > < span class ="line "> </ span > < br > < span class ="line "> "workbench.colorCustomizations": { //覆盖当前所选颜色主题的颜色</ span > < br > < span class ="line "> </ span > < br > < span class ="line "> "editor.background": "#030202", //编辑器背景色</ span > < br > < span class ="line "> </ span > < br > < span class ="line "> "editor.selectionBackground": "#6b5244", //用户选中代码段的颜色 </ span > < br > < span class ="line "> </ span > < br > < span class ="line "> "editor.findMatchBackground": "#ff0000", //当前搜索匹配的颜色</ span > < br > < span class ="line "> </ span > < br > < span class ="line "> "editor.findMatchHighlightBackground": "#ff00ff", //其他搜索匹配项的颜色</ span > < br > < span class ="line "> </ span > < br > < span class ="line "> "editor.findRangeHighlightBackground": "#ff9900", //限制搜索范围的颜色</ span > < br > < span class ="line "> </ span > < br > < span class ="line "> "editor.lineHighlightBackground": "#48314e", //光标所在行高亮内容的背景颜色</ span > < br > < span class ="line "> </ span > < br > < span class ="line "> "editor.lineHighlightBorder": "#704b36" //光标所在行四周边框的背景颜色</ span > < br > < span class ="line "> },</ span > < br > </ pre > </ td > </ tr > </ table > </ figure >
174- < p > 下面放出效果图，读者可自定义自己喜欢的颜色。< br > < img data-src ="https://s1.ax1x.com/2020/07/12/U8tIPJ.png " alt ="U8tIPJ.png "> </ p >
175- < h2 id ="END！ "> < a href ="#END！ " class ="headerlink " title ="END！ "> </ a > END！</ h2 >
180+ < p > 直接在 vscode 左侧 Extensions 中搜索安装即可使用，如果想要尝试其他主题，可输入 One 进行搜索，众多主题总有一款适合你。</ p >
181+ < hr />
182+ < h3 id ="三-设置编辑器背景颜色及光标所在行的颜色 "> < a class ="anchor " href ="#三-设置编辑器背景颜色及光标所在行的颜色 "> #</ a > 三、设置编辑器背景颜色及光标所在行的颜色</ h3 >
183+ < p > 之前习惯用黑色背景，可是改变主题后背景往往会发生改变，可以通过设置自定义背景颜色。< br />
184+ 按照上面的步骤打开 settings.json，添加以下设置：</ p >
185+ < pre > < code >
186+ "workbench.colorCustomizations": { //覆盖当前所选颜色主题的颜色
187+
188+ "editor.background": "#030202", //编辑器背景色
189+
190+ "editor.selectionBackground": "#6b5244", //用户选中代码段的颜色
191+
192+ "editor.findMatchBackground": "#ff0000", //当前搜索匹配的颜色
193+
194+ "editor.findMatchHighlightBackground": "#ff00ff", //其他搜索匹配项的颜色
195+
196+ "editor.findRangeHighlightBackground": "#ff9900", //限制搜索范围的颜色
197+
198+ "editor.lineHighlightBackground": "#48314e", //光标所在行高亮内容的背景颜色
199+
200+ "editor.lineHighlightBorder": "#704b36" //光标所在行四周边框的背景颜色
201+ },
202+ </ code > </ pre >
203+ < p > 下面放出效果图，读者可自定义自己喜欢的颜色。< br />
204+ < img data-src ="https://s1.ax1x.com/2020/07/12/U8tIPJ.png " alt ="U8tIPJ.png " /> </ p >
205+ < h2 id ="end "> < a class ="anchor " href ="#end "> #</ a > END！</ h2 >
206+
176207 </ div >
177208
178209 < footer >
@@ -254,7 +285,7 @@ <h2 id="END！"><a href="#END！" class="headerlink" title="END！"></a>END！</
254285 < div class ="panels ">
255286 < div class ="inner ">
256287 < div class ="contents panel pjax " data-title ="Contents ">
257- < ol class ="toc "> < li class ="toc-item toc-level-2 "> < a class ="toc-link " href ="#vscode%E8%AE%BE%E7%BD%AEFira-Code%E5%AD%97%E4%BD%93%E5%8F%8A%E6%94%B9%E5%8F%98%E7%BC%96%E8%BE%91%E5%99%A8%E5%AD%97%E4%BD%93%E3%80%81%E8%83%8C%E6%99%AF%E9%A2%9C%E8%89%B2 "> < span class ="toc-number "> 1.</ span > < span class ="toc-text "> vscode设置Fira_Code字体及改变编辑器字体、背景颜色</ span > </ a > < ol class ="toc-child "> < li class ="toc-item toc-level-3 "> < a class ="toc-link " href ="#%E4%B8%80%E3%80%81%E8%AE%BE%E7%BD%AEFira-Code%E5%AD%97%E4%BD%93 "> < span class ="toc-number "> 1.1.</ span > < span class ="toc-text "> 一、设置Fira_Code字体</ span > </ a > </ li > < li class ="toc-item toc-level-3 "> < a class ="toc-link " href ="#%E4%BA%8C%E3%80%81%E8%AE%BE%E7%BD%AE%E5%AD%97%E4%BD%93%E9%A2%9C%E8%89%B2 "> < span class ="toc-number "> 1.2.</ span > < span class ="toc-text "> 二、设置字体颜色</ span > </ a > </ li > < li class ="toc-item toc-level-3 "> < a class ="toc-link " href ="#%E4%B8%89%E3%80%81%E8%AE%BE%E7%BD%AE%E7%BC%96%E8%BE%91%E5%99%A8%E8%83%8C%E6%99%AF%E9%A2%9C%E8%89%B2%E5%8F%8A%E5%85%89%E6%A0%87%E6%89%80%E5%9C%A8%E8%A1%8C%E7%9A%84%E9%A2%9C%E8%89%B2 "> < span class ="toc-number "> 1.3.</ span > < span class ="toc-text "> 三、设置编辑器背景颜色及光标所在行的颜色</ span > </ a > </ li > </ ol > </ li > < li class ="toc-item toc-level-2 "> < a class ="toc-link " href ="#END%EF%BC%81 "> < span class ="toc-number "> 2.</ span > < span class ="toc-text "> END！</ span > </ a > </ li > </ ol >
288+ < ol class ="toc "> < li class ="toc-item toc-level-2 "> < a class ="toc-link " href ="#vscode%E8%AE%BE%E7%BD%AEfira_code%E5%AD%97%E4%BD%93%E5%8F%8A%E6%94%B9%E5%8F%98%E7%BC%96%E8%BE%91%E5%99%A8%E5%AD%97%E4%BD%93-%E8%83%8C%E6%99%AF%E9%A2%9C%E8%89%B2 "> < span class ="toc-number "> 1.</ span > < span class ="toc-text "> vscode 设置 Fira_Code 字体及改变编辑器字体、背景颜色</ span > </ a > < ol class ="toc-child "> < li class ="toc-item toc-level-3 "> < a class ="toc-link " href ="#%E4%B8%80-%E8%AE%BE%E7%BD%AEfira_code%E5%AD%97%E4%BD%93 "> < span class ="toc-number "> 1.1.</ span > < span class ="toc-text "> 一、设置 Fira_Code 字体</ span > </ a > </ li > < li class ="toc-item toc-level-3 "> < a class ="toc-link " href ="#%E4%BA%8C-%E8%AE%BE%E7%BD%AE%E5%AD%97%E4%BD%93%E9%A2%9C%E8%89%B2 "> < span class ="toc-number "> 1.2.</ span > < span class ="toc-text "> 二、设置字体颜色</ span > </ a > </ li > < li class ="toc-item toc-level-3 "> < a class ="toc-link " href ="#%E4%B8%89-%E8%AE%BE%E7%BD%AE%E7%BC%96%E8%BE%91%E5%99%A8%E8%83%8C%E6%99%AF%E9%A2%9C%E8%89%B2%E5%8F%8A%E5%85%89%E6%A0%87%E6%89%80%E5%9C%A8%E8%A1%8C%E7%9A%84%E9%A2%9C%E8%89%B2 "> < span class ="toc-number "> 1.3.</ span > < span class ="toc-text "> 三、设置编辑器背景颜色及光标所在行的颜色</ span > </ a > </ li > </ ol > </ li > < li class ="toc-item toc-level-2 "> < a class ="toc-link " href ="#end "> < span class ="toc-number "> 2.</ span > < span class ="toc-text "> END！</ span > </ a > </ li > </ ol >
258289 </ div >
259290 < div class ="related panel pjax " data-title ="Related ">
260291 </ div >
0 commit comments