搭配环境:
1 下载vscode和chrome
2 装配vscode中的插件
chinese 中文简体Debugger for Chrome 代码调试器Auto Rename Tag 自动命名成对的HTML/XML标记Auto Close Tag 自动添加HTML XML关闭标记Auto Complete Tag 扩展包添加关闭标记全部重命名HTML CSS Support 对css的支持HTML文档HTML Snippets 完整HTML标记包含片段javaScript（ES6）code snippets 语法字符中的javaScript 代码片段Live Server 本地服务器与实时重新加载Markdown Preview Enhanced 增强移植到vscodemarkdownlint 样式检查Matarial lcon Theme 文件图标One Dark pro 标志性主题prettier-Code formatter 使用更漂亮的代码
3. 装配chrome中的插件
AdBlocker-Adblock plus 拦截广告CHarset 用于谷歌浏览器进行编码Tampermonkey 用于破解某些网页的vipVue.js devtools 开发者工具iGG谷歌访问助手划词翻译简悦-simpReadlnfinlty 新标签页page Ruler Redux 尺子专门测量网页大小Just Color Picker 取色器
标签:
页面上看到的内容就是元素元素是由标签描述，标签根据元素类型分：单标签和双标签,每一个元素的特征由属性来描述，描述的属性写到起始标签中元素是由标签和属性共同进行描述的
//从大到小 除了设置文档标题之外，还可以用来划分页面结构# 标题标签## 标题标签### 标题标签#### 标题标签##### 标题标签###### 标题标签//段落的插入<P>段落标签</p>//js的script标签<script>const SITE = ""php中文网</script>//链接标签//href是跳转的地方，target是当前页面的跳转方式,_self是在当前页面跳转,_blank是在新的窗口打开新的页面<a href="https://www.php.cn/" target="_self">php中文网</a><a href="https://www.php.cn/" target="_blank">php中文网</a>//内联框架//在指定的窗口打开 target中内联框架的name值<a href="https://www.baidu.com/" target="baidu">打开小度</a>//src是框架页面跳转的地址,srcdoc设置框架页面文字描述,width表示宽度,height表示高度<iframe srcdoc="<em>点击上面的:小度</em>" name="baidu" width="400"></iframe>
//锚点的使用,可以在当前页面任意跳转
<a href="#footer">跳转到底部</a>//创建锚点//div是通用的容器标签，内部可以放任何类型的元素<div id="footer" style="margin-top: 1000px">俺是底部</div><a href="#">回到顶部</a>
图片标签
<img src="https://img.php.cn/upload/course/000/000/001/5d24289c99b05106.jpg" alt="web前端开发" width="200" />//img是图片标签名称，alt是当图片显示不出来的时候才显示，图片设置大小只需要设置一个,宽或高，另一个会自动缩比
