HTML常用标签和特殊符号

Posted il_持之以恒_li

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了HTML常用标签和特殊符号相关的知识,希望对你有一定的参考价值。

html常用标签和特殊符号

常用标签如下:


标签含义
<h1>至<h6>标题标签
<p>段落标签
<br>、 <br/> 两者都可换行标签
<hr>、 <hr/>两者都可水平线标签
字体加粗 <strong> 斜体 <em>字体样式标签
<img src=“图片路径” alt="" title="" width="" height=""> alt代表提示信息,
图片显示异常时会提示的信息,title鼠标放到图片上时会显示的信息,
width,height表示可以设置图片在浏览器上显示的像素宽、高
图片标签
<a href=“链接地址” target="">文字内容</a>,target有两个值,分别为_blank、_self,
前者新打开一个窗口,后者直接在当前页面上刷新显示,默认值为_self
超链接标签
(1)<a href="#mark"></a>
<a name=“mark”>内容</a>,可以快速找到相应的内容
(2)任意一个标签里直接加一个id属性
锚链接
放在<head></head>内部,<base target=’_blank’>
设置当前网页所有a标签的target属性值
base标签
(1)无序列表<ul><li></li></ul>,快捷方式ul>li
(2)有序列表<ol><li></li></ol>
列表标签
<dl><dt></dt><dd></dd></dl>自定义列表
<video src="" controls=“controls”></video>controls的值表示显示视频条视频标签
<audio src="" controls=“controls”>当前浏览器支持audio</audio>controls的值表示显示音乐条音频标签

这里讲一下锚链接
如果一个网页信息很多,我们要找到我们需要信息需要滑动滚动条很久才能找到,这个时候可以使用锚链接,这样就可以快速找到我们需要的信息了。如下例子

<!DOCTYPE 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">
    <title>锚链接</title>
    <style type="text/css">
        img{
            width: 1152px;
            height: 864px;   
        }
    </style>
</head>
<body>
    <a href="#a1">公孙离</a>
    <a href="#a2">李白</a>
    <a href="#a3">娜可露露</a>
    <a href="#a4">王昭君</a>
    <a href="#a5">小乔</a>
    <ul>
        公孙离
        <li>
            <a name="a1">
                <img src="../imgs/公孙离.jpg" alt="">
            </a>
        </li>
        李白
        <li>
            <a name="a2">
                <img src="../imgs/李白.jpg" alt="">
            </a>
        </li>
        娜可露露
        <li>
            <a name="a3">
                <img src="../imgs/娜可露露.jpg" alt="">
            </a>
        </li>
        王昭君
        <li>
            <img id="a4" src="../imgs/王昭君.jpg" alt="">
        </li>
        小乔
        <li>
            <img id="a5" src="../imgs/小乔.jpg" alt="">
        </li>
    </ul>
</body>
</html>

这个界面放了几张图片图片,如果我们想看一下图片内容,需要滚动滑动条,这里设置锚链接就不一样。
运行结果:

在这里插入图片描述
代码里实现锚链接的两种使用方法都有

特殊符号


特殊符号含义
&nbsp;空格
&gt;大于符号(>)
&lt;小于符号(<)
&quot;引号(")
&copy;版权符号(©)

以上是关于HTML常用标签和特殊符号的主要内容,如果未能解决你的问题,请参考以下文章

HTML学习笔记——常用标签

Java Web - HTML 常用标签和符号

Unity常用标签

HTML常用标签(自用,可能不严谨,勿怪)

HTMLHTML 标签 ⑤ ( 锚点定位 | base 标签 | 预格式化文本标签 | HTML 特殊符号 )

HTML常用标签和符号及案例