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>
