一.关于html的理解
html不是一门语言,而是一个超文本标签语言(hyper text markup language)
二.html 的作用
将标签文本语言输入到浏览器中去
三.html的结构
<!-- 告知程序员这是一个html文件 -->
<html lang="en">
<!-- 编译语言为英文 -->
<head>
<meta charset="UTF-8">
<!-- 整个编译文件的字符编码---防止文字乱码 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <!-- 文档兼容的定义 --> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- 多媒体查询 -->
</head>
<body>
我们的标签文字内容音频存放的位置!
</body>
</html> 四.标签的类型 1.文字文本标签 (1)标题标签:h标签 header---h1-h6
这是一个标题!
h标题标签的作用 1.让我们的文字改变大小和颜色(普通文字的大小为16px,标题标签所用之后文字的大小为32Px) 2.独占一行 3.双标签
(2)段落标签:P标签 paragraph---p(段落标签) p---段落标签的作用 1.独占一行 2.双标签 2.下划线和换行标签 (1)下划线标签<hr> <!-- 单标签 -->
<hr> <!-- horizonal -->
(2) 换行标签 遇事冷静的对待 但是也是需要积极性 <!-- break --> <!-- 换行 --> 两者的特性: 1.不参与是否独占一行的元素的讨论 2.都是单标签 3.div和span的标签 div标签独占一行 span标签非独占一行
4.锚点标签
<!-- achor---锚点 -->
<a href=""></a>
(1)href:链接目的
<a href="https://www.baidu.com">百度一下</a>
<!-- 1.跳转到网络路径(需要加上我们的网络协议) -->
<a href="../day01/"target="_blank">div</a>
(2)target---靶心,是否在新的页面打开链接地址(默认的是在本页面打开),_blank--新的页面打开 _self---在本页面打开
(3)路径
相对路径:以文本作为出发点
绝对路径 :以磁盘作为出发点
./---在当前文件的文件夹下
../---返回到上一级文件夹
(4)锚点标签的作用
a.颜色和文字的样式有改变
b.有链接跳转的功能
c.非独占一行
(5)锚点定位
<div id="one">
Lorem ipsum dolor sit, amet consectetur adipisicing elit. Autem temporibus ratione itaque consequatur mollitia deserunt quo, obcaecati modi minus rerum asperiores, fuga, qui consequuntur possimus magni commodi numquam aperiam error.
br*100
<a href="#one">点击我返回顶部</a>
<!-- #表示网络地址 -->
(6)锚点标签下载
<!-- 下载功能的a标签 -->
<a href="../6ED687EA42E4AD97EFFBAA089037AC1C.rar">点击下载</a>
五.浏览器 uc qq 360(在前端开发中不太推荐使用) 五大浏览器:chorme(谷歌) firefox(火狐) IE(微软) saferi(苹果) opera(欧朋)