1.什么是前端
<!-- shift + 1 快速生成网页基本文档结构 -->
<!-- ctrl+/ 注释 -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- 什么是前端？
前端页面，所有打开页面，
能看到的东西。
前端页面又三层构成
结构层：由html或者Xml之类的标记语言创建的，解决内筒是什么
给网页搭架子，搭结构--毛坯房
表现层：由css负责创建，如何显示内容，相当于精装修
行为层：由脚本负责-Javascript 实现人机交互功能
装了一些只能家具
html+css+js
-->
</body>
</html>
2.html基本标签
（1）<!DOCTYPE html>
（2）<html lang="en">
（3）<head>
（4）<body>
（5）网页基本元素，图片，文字，链接，表格，列表
<!DOCTYPE html>
<!-- DOCTYPE
doc document 文档
type 类型
-->
<html lang="en">
<!-- html 跟标签 lang language en English -->
<head>
<!-- head 头部标签 ，对当前网页的基本信息进行设置-->
<meta charset="UTF-8">
<!-- meta 设置网页的相关信息 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>周周</title>
</head>
<body>
<!-- 主体，身体 ，展示给用户看到的，主题内容-->
<!-- MDN
标签，html基本单位
<标签></标签> 成双成对出现的 双标签
<标签> 单个出现的 单标签
1.标签和属性时 都是小写格式
2.双标签必须成对出现
3.标签的写法， <标签名 属性名=“属性值”>内容 </属性值>
-->
<!-- 网页中的基本元素？ 文字 图片 超链接 列表 表格 -->
<!--
1.p 段落标签
段落具备自动换行功能
段落与段落之间 存在一个明显的空袭
-->
<p>我是段落标签</p>
<p>helloworld!</p>
<!-- 2.h 标题标签
由n:1-6组成，代表不同大小的标题，h7存在，代表就是普通字体
-->
<h1>一号标题</h1>
<h2>二号标题</h2>
<h3>三号标题</h3>
<h4>四号标题</h4>
<h4>四号标题</h4>
<h5>五号标题</h5>
<h6>六号标题</h6>
<!--
3. span 空标签
会在一行显示，不具备换行效果
-->
<span>你<br>好</span>
<br>
<!--
4.br 强制换行标签
没有和段落标签一样的空袭
-->
<span>世界</span>
<!--
5.特殊文本标签
-->
<br>
<strong>加粗</strong>
<b>你好，世界！</b>
<u>下划线</u>
<i>斜体</i>
<!-- 可以随便嵌套 -->
<p>原价<b>999</b> 现价<u>998</u></p>
<i>斜体</i>
<!-- 因为p标签自动换行，所以第二个斜体出现在第二行了 -->
<del>删除文本</del>
<s>删除</s>
<!--
6.特殊字符 注意：不许是&开头，;结尾
-->
¥ 人民币
© 版权标记
® 商标
< 小于号
> 大于号
这是一段 空格
<!--
7.线条标签 分割
-->
<br>
<br>
<hr color="blue" size="5">
<!--
8.图片标签 <img src="图片地址" alt="">
./ ../
src 存放引入图片直至 相对路径和绝对路径
alt 当图片无法正常显示是的替代文本
title 用户鼠标移入图片时的提示文本
-->
<img src="./宝儿姐/timg.jpg" alt=宝儿姐 title="社会我宝儿姐">
<!--
9.链接标签
<a href="用来存放跳转后的网页地址">跳转歌单</a>
href 用来存放跳转后的网页地址
target 用来指定王爷的打开方式
-->
<a href="https://music.163.com/playlist?id=2060537603&userid=1342983576"
target="_blank"
> 跳转歌单 </a>
<a href="https://music.163.com/playlist?id=2060537603&userid=1342983576"
target="_self"
> 网易云 </a>
<a href="#">回到顶部</a>
<!-- # 回到当前页面的顶部 -->
</body>
</html>
