前端秘法引言(配置vscode, 以及html的基础)

简介: 前端秘法引言(配置vscode, 以及html的基础)



一.配置环境vscode

vscode官网https://code.visualstudio.com/

点击右上角的download

根据不同的操作系统进行下载安装,我这里选的是Windows x64

安装好后打开,点击左上角的文件(Files)->打开文件夹(open folder)->创建新文件->选择

点击第一个图标,创建一个后缀名为.html的文件即可

二.配置插件

这里我们配置四个插件

大概说一下,第一个插件是为了保证我们在修改标签时同时修改<></>这两个

第二个是配置汉语言包,可有可无

第三个是我们能够直接在vscode界面运行代码打开浏览器

第四个是我们再修改并保存代码后不用刷新浏览器

三.vscode的实用小技巧

1.快速生成代码大纲

!+回车即可

lang = 'en'是默认语言为英语

charset="UTF-8"是默认的解码规则为UTF-8,因为大部分浏览器的编码规则是UTF-8

name="viewport" content="width=device-width, initial-scale=1.0"

这个解释起来有点麻烦,不过通俗来讲是为了让你的程序在移动端也能运行

2.Ctrl+s

快速保存代码,代码只有保存后才能在浏览器上显示出来效果

3.Ctrl+/

批量注释代码,html的注释语言为<!--  -->

四.标题段落换行标签

事实上html语言本身就是一种数据结构--Dom树,通过编写代码实现对数据的增删查改,而html语言是有一个一个标签组成的,这些标签实际就是树的节点,而其中又通过缩进来区分不同的层级,<html>是根,<body>与<head>同级

标题标签

<title>

在这个位置显示

段落标签

<p>

换行标签

<br>

五.格式化标签

1.加粗,strong,b

2.倾斜,em,i

3.删除线,del,s

4.下划线,ins,u

每种格式化标签都有两种代码表达方式,区别就是前者就有强调性

相关文章
|
1月前
|
开发框架 前端开发 JavaScript
前端框架演进史:从HTML到现代化开发
前端框架演进史:从HTML到现代化开发
33 0
|
1月前
vscode中创建html
vscode中创建html
|
2天前
|
前端开发 搜索推荐 数据安全/隐私保护
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
13 1
|
25天前
|
移动开发 前端开发 HTML5
Web前端全栈HTML5通向大神之路
本套课程共三大阶段,六大部分,是WEB前端、混合开发与全栈开发必须要掌握的技能,从基础到实践,是从编程小白成长为全栈大神的最佳教程!
32 3
Web前端全栈HTML5通向大神之路
|
1月前
|
前端开发 JavaScript 开发者
前端的HTML使用
前端的HTML使用
15 3
|
1月前
|
前端开发
web前端-HTML-div语法
web前端-HTML-div语法
|
2月前
|
前端开发 JavaScript
前端 JavaScript 与 HTML 怎么实现交互
前端 JavaScript 与 HTML 怎么实现交互
|
7天前
|
前端开发 JavaScript 开发工具
【HTML/CSS】入门导学篇
【HTML/CSS】入门导学篇
17 0
|
2天前
|
PHP
web简易开发——通过php与HTML+css+mysql实现用户的登录,注册
web简易开发——通过php与HTML+css+mysql实现用户的登录,注册