前端HTML基础知识

五大浏览器

        IE浏览器 ，火狐Firegox浏览器，谷歌Chrome浏览器，Safari浏览器，欧朋Opera浏览器

排版标签

        <h1>-<h6> 标题标签
        <p></p>  段落标签
        <br> 换行标签 // 单标签
        <hr> 水平线标签 // 单标签

<h1>我是最大的标题</h1>
<h6>我是最小的标题</h6>
<br>我在前面换行了一般在p标签中使用
<hr>这是一条长长的水平分界线

 

文本格式化标签

后面语义化强一些，对人好理解，对机器容易解析，对搜索引擎(SEO)有帮助
        <b>                  加粗             <strong>
        <u>                  下划线          <ins>
        <i>                   倾斜              <em>
        <s>                  删除线          <del>

<b>我是加粗的文本</b>
<strong>我是加粗的文本，语义化高</strong>
<hr>
<u> 我是有下划线的文本</u>
<ins> 我是有下划线的文本，语义化强</ins>
<hr>
<i>我是倾斜的文本</i>
<em>我是倾斜的文本，语义化强</em>
<hr>
<s>我是有删除线的文本</s>
<em>我是有删除线的文本，语义化强</em>

 

 

 

媒体标签

<img src="图片路径" alt="替换文本" title="提示文本" width="图片宽度" height="图片高度"> // 单标签 
        src 目标图片路径  
        alt 是替换文本，照片显示不了，显示文本 
        title文本提示，鼠标在照片上显示
        图片宽度width高度height        只设置一个不会变形，另外一个会等比例缩放；同时设置两个属性可能会变形

绝对路径 'D:\day01\images\1.jpg'，相对路径 './images/1.jpg '-----(  ./ 同级     ../ 上一级   / 下一级）

 <img src="./img/a.jpg" alt="照片显示不出来时 显示" title="这是美女" width="300px">

 

 

音频标签

目前仅支持三种模式 Mp3 、Wav 、Ogg
<audio src="./music.mp3" controls></audio>
src 音频路径
controls 显示播放的控件
autoplay 自动播放（部分浏览器不支持）
loop 循环播放

<audio src="./public/music/mouseOver.mp3" controls>我是音频标签</audio>

 

视频标签 

目前仅支持三种格式 Mp4、WebM、Ogg
<video src="./video.mp4" controls></video>
src 视频路径
controls 显示播放的控件
autoplay 自动播放    -------谷歌浏览器支持muted属性实现静音播放
loop 循环播放

<video src="./public/video/05-显示隐藏密码下.mp4" controls>我是视频标签</video>

 

链接标签

称呼：a标签，超链接，锚链接
外部链接 <a href="https://www.baidu.com/"></a>
内部链接 <a href ="./01.html"></a> // 若href的属性值为#，则是空链接
<a href = "javascript:void(0);"> </a> // 禁止链接跳转  也可通过 href="javascript:;" 实现  ------javascipt是伪协议，表示url的内容通过javaScipt执行，void(0)表示不作任何操作，防止链接跳转到其它页面

<a href="https://www.baidu.com/">点我可以跳到百度首页去</a>
<a href="./Date.html">我可跳到我写的指定html网页</a>
<a href="javascript:void(0)">我是禁止跳转的链接</a>
<a href="javascript:;">我也是禁止跳转的链接</a>