a标签的补充
1.基础语法结构
<a href="http://www.baidu.com" title="百度一下,你就知道" target="_blank">百度</a>
title: 鼠标悬浮显示的文字 blank 在新窗口打开 self 在当前窗口打开
2.给超链接添加返回顶部效果
<a href="#">返回顶部</a>
3.空连接(暂时占位,不跳转)
< a href="#">返回顶部</a>
4.在a标签中添加js代码
<a href="javascript:alter('123');">返回顶部</a>
alter 提示框
5.拨打电话(移动端使用)
<a href="tel:"电话号码">拨打电话</a>
6.发送邮件
<a href="mailto:邮箱">发送邮件</a>
锚点链接
创建锚点
<a name ="锚点名称"></a>
链接到锚点同一页面
< a href="锚点名称"></a>
链接到锚点不同页面
< a href="目标文档URL(路径)#锚点名称"></a>
作用:可以直接跳转到该锚点链接,无需不停地滚动来寻找
热点地图
<a href="http://www.baidu.com" >
<img src="./img/R-C.jfif" alt="衣服4" usemap="#only">
<map name="only" id="only" >
<area shape="rect" coords="279,21,552,374" href="http://www.baidu.com" alt="上衣" target="blank">
<area shape="circle" coords="306,749,60" href="http://jd.com" alt="鞋子" target="blank">
<area shape="poly" coords="297,393,504,398,518,672,468,658,401,443,351,653,301,659,297,393" href="http://taobao.com" alt="裤子" target="blank">
</map>
</a>
rect 矩形 取两个顶点,定点延伸的交点就是矩形的范围
circle 圆形 取圆心,圆心到另一边的距离运算得到半径
poly 多边形 取多边形的每个顶点环绕一周回到起点
列表标签
有序列表
<ul type="disc|square|circle">
<li>谷歌</li>
<li>天猫</li>
<li>京东</li>
<li>淘宝</li>
<li>唯品会</li>
</ul>
disc 实心圆 square 实心矩形 circle 空心圆
无序列表
<ol type="a|A|i|I" start="num">
<li>谷歌</li>
<li>天猫</li>
<li>京东</li>
<li>淘宝</li>
<li>唯品会</li>
</ol>
a,A,i,I指的是类型,a是a~z,A是A~Z,i和I是罗马数字大写和小写之分,num 指的是第几个数字,
start ="num"指的是从第几个数字开始
自定义列表
<dl>
<dd></dd>
<dt></dt>
</dl>
字符实体
-
在 HTML 中,某些字符是预留的,比如HTML 中不能使用小于号(<)和大于号(>),这是因为浏览器会误认为它们是标签
-
如果希望正确地显示预留字符,我们必须在 HTML 源代码中使用字符实体,比如<用 < 或< 表示
-
字符实体由三部分组成:
-
以&开始
-
中间为实体名或实体编号
-
以 ; 结束
-
-
实体名称便于记忆而实体编号的浏览器兼容性更好
图文并茂
<figure>
<figcaption>文字</figcaption>
<img src="1.png" width="200">
</figure>
figure 插图元素
figcaption 表示插图的标题内容