HTML基础标签及基本知识

编程入门行业动态更新时间:2024-10-09 06:27:12

HTML基础标签及 <a href=https://www.elefans.com/category/jswz/34/1768060.html style= 基本知识"/>

HTML基础标签及基本知识

认识HTML：

        超文本标记语言(hyper text markup language)
       HTML不是一种编程语言，而是一种标记语言，描述网页的语言
       HTML使用标签描述网页中图片、文本、音乐、视频、超链接等

   *语法：
           1.文档的后缀名为：.html 或者 .htm - 两者无区别
           2.标签分为：
               (1)有开始标签和结束标签。如：<hrml> </hrml>
               (2)自闭和标签：开始标签和结束标签在一起。如：<br/> 换行标签
           3.标签可以嵌套：
               需要正确的嵌套，不能你中有我，我中有你；
                   错误：<a> <b> </a> </b>
                   正确：<a> <b> </b> </a>
           4.在开始标签内可以定义属性。

属性由键值对构成，值需要用引号（单双都可以）引起来；
5.html的标签不区分大小写，但是建议使用小写！

*注释和特殊符号：
           *注释： 快捷键：ctrl + /
           空格： 
           大于：>
           小于：⁢
           引号："
           版权号：@© ©

   *基本标签：
       <h1>~<h6> 标题
       <p>段落
       <br>换行
       <hr>间隔线
       <em>斜体
       <strong>加粗

简单案例：如梦令

</p>
<hr color="red" width="100%">
<h1>如梦令</h1>
<h3>李清照 &copy;</h3>
<hr color="blue" width="100%">
<p><em>常记溪亭日暮，沉醉不知归路。</em><br><strong>兴尽晚回舟，误入藕花深处。</strong><br>争渡，争渡，惊起一滩鸥鹭。
</p>

执行结果：

   *标签：
   旧文本：<font>文字 <br>换行 <hr>间隔线 <h1>标题 <p>换段 <b>加粗 <i>斜体 <center>居中
   链接：

          1.页面间得链接：<a href="链接路径或网址">名称</a>
       2.锚链接：跳至自身固定位置或者A页面跳到B页固定位置，需要锚标记
           链接标识：<a href="页面路径#位置名">点击标识</a> -
           指定位置：<a name="位置名"></a>
           eg：<a name="target"></a> --指定该位置名为target
               <a href="jinyesi.html#target">静夜思的音乐</a>
                   -- 点击标识静夜思的音乐就会直接到达文件jinyesi页面的target位置
       3.功能性链接：电子邮件.QQ.MSN 等链接
           eg：<a href="tencent://Message/?Uin=666666&Site=&Menu-=yes">QQ联系</a>
               <a href="mailto:666666@qq">邮件</a>

链接简单案例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>超链接</title>
</head>
<body>
<!--页界面链接-->
<a href="jinyesi.html">静夜思</a>
<a href="/">百度</a><br>
<!--锚链接-->
<a href="jinyesi.html#target">静夜思得视频</a><br>
<!--功能性链接-->
<a href="tencent://Message/?Uin=666666&Site=&Menu-=yes">QQ联系</a>
<a href="mailto:666666@qq">邮件</a>
</body>
</html>

结果：

   图片：<img src="图片路径"/>
   音频：<audio src="音频路径" controls="controls"></audio>
   视频：引入视频文件：<video src="视频路径" controls></video>
       给视频文件添加功能：（且闭合内的视频内容只播放读取到的第一个可播放文件，若读取到的第一个无法读取就会播放下一个继续读取）
       <video controls autoplay>
                   <source src="视频路径.webm"></video>
                    <source src="视频路径.mp4"></video>
       </video>

*备注：controls ：播放功能键； autoplay：自动播放；

<body>
<!--音频 audio src= -->
<audio src="file/mmm.mp3" autoplay controls></audio>
<br><hr>
<!--视频 video src= -->
<video src="file/bd.mp4" controls></video>
<video controls autoplay><source src="file/bd.avi"><source src="file/bd.mp4">
</video>
<br>
</body>

结果：

更多推荐

HTML基础标签及基本知识

本文发布于:2024-02-27 19:34:39，感谢您对本站的认可！

本文链接:https://www.elefans.com/category/jswz/34/1765863.html