今日正式开始学习前端，学习内容有
1.标签的写法：标签分为单标签和双标签，其中他们都是由尖括号组成<>，例如：加粗标签<strong></strong>，倾斜标签<em></em>，下划线标签<ins></ins>，删除线标签<del></del>。
2.HTML的基本骨架：HTML主要由<HTML></HTML>组成，在这里面有<head></head>head是给浏览器看的,<body></body>body是给用户看的，我们一般写代码都在这里，在VScode中可以使用！一键生成HTML的骨架。
3.标签的关系：标签的关系分为两类1.父级关系，类似于嵌套，html标签里面有head和body2.兄弟关系，类似于并列，就像body标签和head标签一样。
4.注释：注释可以直接用 / /，也可以使用ctrl+/ 更方便一些，方便自己和其他人理解代码。
5.标题标签：标题标签就是用来写一篇文章的标题的，用<h1></h1>~<h6><h6>这6种标题种类，h1只能有一个可以做主标题或logo，其余标题可以有多个，由1-6，标题样式逐渐减小。
6.段落标签：<p></p>是段落标签，用来包裹一段话，可以自动换行和加空行也可以在里面加入超链接，或文字加粗，下划线等。
7.换行和水平线标签：<br>是换行标签，这是一个单标签，就是用来主动的换行，作用像是键盘的enter。<hr>是水平线标签，作用就是在界面中加一个水平线。
8.文本格式化标签：就是1里面提到的，加粗，倾斜，下划线，删除线。
9.图像：要在界面中添加图像用到<img src=" 路径" />，在尖括号里面可以添加图片的属性，(alt=" " 以前网速慢，可能导致图片加载不出来，不想影响网页内容的浏览，用alt替换 ),(title=" " 将鼠标放到图片上，可以看到图片的名称),(width=," "heigth=" " 浏览器缩放图片，默认是等比例缩放).
10.路径：路径分为绝对路径和相对路径，一般来说我们使用相对路径，相对路径用法：. 表示当前目录，. . 表示上一级目录，/ 表示进入这个目录，/ 后面跟要引入的图片。绝对路径:就是图片在磁盘中的位置和一些超链接。我们在界面中给友情链接会使用超连接。
11音频：页面添加音频用到<audio src=" 路径" >也可以在里面添加属性，如果属性名和属性值一样，可以只把属性名写出就行，后面的属性都是。controls表示在页面中显示出来，一般都是需要的，loop循环播放， autoplay自动播放，一般浏览器是不会让自动播放的，加上也没用。
12.视频：页面添加需要用到<video src=" 路径"> 也可以在里面添加属性，controls页面显示， loop，循环播放 muted静音播放， autoplay自动播放。当有静音的时候视频可以自动播放。
13.超链接：超链接用到<a herf=" 路径" >超链接名字</a>，直接用这是在自己的窗口打开， target="_blank" 新窗口跳转页面，开发初期，不知道超链接的跳转地址，href属性值写#，表示空链接，不会跳转。
综合案例一代码。
1 <!DOCTYPE html> 2 <html lang="en"> 3 4 <head> 5 <meta charset="UTF-8"> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 7 <title>个人简介</title> 8 </head> 9 10 <body> 11 <h1>尤雨希</h1> 12 <hr> 13 <p>尤雨溪，前端框架<a href="./15综合案例二.html">Vue.js</a>的作者，<a href="#">HTML5</a> 版Clear的打造人，独立开源开发者。曾就职于Google Creative Labs和 14 Meteor Development Group。由于工作中大量接触开源的项目<a href="#">JavaScript</a>，最后自己也走上了开源之路，现全职 15 开发和维护<a href="./15综合案例二.html">Vue.js</a>。</p> 16 <img src="./cat.jpg" alt="尤雨希" title="尤雨希" width="270"> 17 <h2>学习经历</h2> 18 <p>尤雨溪毕业于上海复旦附中，在美国完成大学学业，本科毕业于Colgate University，后在Parsons设计学院获得Design & Technology艺术硕士学位， 19 任职于纽约Google Creative Lab</p> 20 <h2>主要成就</h2> 21 <p>尤雨溪<strong>大学专业并非是计算机专业</strong>，在大学期间他学习专业是室内艺术和 22 艺术史，后来读了美术设计和技术的硕士， <ins>正是在读硕士期间，他偶然 23 接触到了JavaScript ，从此被这 24 门编程语言深深吸引，开启了自己的前端生涯。</ins></p> 25 <p>2014年2月，开发了一个前端开发库Vue.js。Vue.js 是构建 Web 界面的 JavaScript 框架，是一个通过简洁的API提供高效的 26 数据绑定和灵活的组件系统。</p> 27 <h2>社会任职</h2> 28 29 <p>2016年9月3日，在南京的JSConf上，Vue作者尤雨溪正式宣布加盟阿里巴巴Weex团队，尤 30 雨溪称他将以技术顾问的身份加入Weex团队来做 Vue 和 Weex 的 JavaScript runtime 31 整合，目标是让大家能用 Vue 的语法跨三端。</p> 32 </body> 33 34 </html>
综合案例二代码。
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <title>Vue 简介</title> 7 </head> 8 <body> 9 <h1>Vue.js</h1> 10 <p>Vue (读音 /vjuː/，类似于 view) 是一 11 套用于构建用户界面的渐进式JavaScript 12 框架。 [5] 与其它大型框架不同的是， 13 Vue 被设计为可以自底向上逐层应用。 14 Vue 的核心库只关注视图层，不仅易于上 15 手，还便于与第三方库或既有项目整合。 16 另一方面，当与现代化的工具链以及各种 17 支持类库结合使用时，Vue 也完全能够为 18 复杂的单页应用（SPA）提供驱动。</p> 19 <p>其作者为 <a href="./14综合案例一.html" target="_blank">尤雨希</a></p> 20 <h2>主要功能</h2> 21 <p>Vue.js是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue采用自底向上增量开发的设计。Vue 的核心库只关注视图层，并且非常容易学习，非常容易与其它库或已有项目整合。另一方面，Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。</p> 22 <p>Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。</p> 23 <p>Vue.js 自身不是一个全能框架——它只聚焦于视图层。因此它非常容易学习，非常容易与其它库或已有项目整合。另一方面，在与相关工具和支持库一起使用时 [2] ，Vue.js 也能驱动复杂的单页应用。</p> 24 <video src="./media/vue.mp4" controls></video> 25 </body> 26 </html>
效果图：
标签：Vue,标签,JavaScript,js,超链接,01HTML,CSS,属性 From： https://www.cnblogs.com/Lyh3012648079/p/18324971