Vscode软件配置及Html元素标签含义
1.环境配置
- 编辑器：Vscode
- 浏览器：chrome
2.Vscode常用插件
- Chinese 中文插件
- HTML CSS Support 第三方弥补官方代码提示不足
- HTML/CSS/Javascript Snippets 代码片段
- Auto Rename Tag 标签自动更名
- Auto Close Tag 标签自动关闭
- One Dark Pro 护眼深色主题 天蓬老师推荐solarized（日晒主题）
- markdownlint Markdown 语法检查器
- Markdown Preview Enhanced Markdown预览
- Live Server 让代码直接运行不需要刷新
通过微软账号，即使更换电脑也可以自动同步插件
3.chrome浏览器插件
- iGG谷歌访问助手 用来访问谷歌chrome商店
- Charset 修改网站编码
- Dark Reader 暗黑护眼模式
- chrome-color-picker 取色器
- Page Ruler Redux 尺子前端量尺寸
- 划词翻译/简悦/
4.元素和标签及属性
页面是由元素构成，用标签描述元素，元素特征用属性描述，而属性要写到标签中
标题和段落
<!-- 一段内容到底是标题还是段落，需要用标签来描述 --><h1>今天天气很好</h1><p>这是一段文字</p>
页面中看到的内容就是元素，html中的所有内容，要添加到页面中，必需要使用一个标签
标题除了设置文档标题外，还可用来划分页面结构
<h1>大标题</h1><h2>二级标题</h2><h3>三级标题</h3><h4>四级标题</h4><h5>五级标题</h5><h6>六级标题</h6>
一个页面一般只用一个大标题
内容<p></p> P标签
<p>有朋自远方来，不亦乐乎！</p>
链接与锚点
链接标签 a标签
<a href="https://www.baidu.com" target="_blank">百度一下</a><!-- 在新窗口打开百度 -->
在
<iframe></iframe>中打开a链接，需要使用<iframe>标签的name属性绑定a链接的target属性，name值要与target值相同
<a href="http://www.php.cn" target="kj">php中文网</a><iframe name="kj" srcdoc="点击链接在此打开中文网" width="360"></iframe>
锚点使用id添加锚点，用a标签进行跳转，在当前页面加#号跳转
<a href=#footer>跳转底部</a><!-- 创建锚点 --><div id="footer" style="margin-top:1000px">我是底部</div><a href="#">回到顶部</a>
图片元素
图片标签使用<img>标签
<img src="图片地址" alt="替代图片的文字" title="鼠标放在图片上时的提示文字">
<img src="周杰伦.jpg" alt="周杰伦" title="无与龙比 为杰沉沦！" width="600px">
Markdown 无法设置图片大小