一些常见元素（div+a+iframe+img+video+列表

最新推荐文章于 2024-09-15 22:12:53 发布

Binet_000

最新推荐文章于 2024-09-15 22:12:53 发布

阅读量168

点赞数

文章标签： html

本文链接：https://blog.csdn.net/weixin_43888905/article/details/115030041

版权

文章目录

div容器元素

划分区域，装其他元素。

div无语义，做网页尽量使用有语义的标签。

<header>：定义文档的页眉（介绍信息）
<article>：包裹文章文本相关标签，可能包括论坛帖子、报纸文章、博客条目、用户评论。
<section>：标签定义文档中的节、区段。
<footer>：定义文档或节的页脚。
<aside>：如图

a元素

a元素href属性

普通链接

<a href="https://csdn.net"></a>

URL统一资源定位器：
schema://host/port/path
schema: http、https、file
host: IP、域名
port: 端口号
当当前页面的协议和目标页面相同时，超链接的协议可以省略。

锚链接

鼠标滚轮选定并列内容

((h2[id=“chapter$”]>{章节$})+p>lorem500)*6

<!--锚链接-->
<a href="#chapter5"></a>

跳转锚点后地址改变为xxx.html#chapter5

功能链接

<!--触发弹出框-->
<a href="javascript:alert('hello!')">触发弹出框</a>
<!--发送邮件-->
<a href="mailto:xxxxxx@xxx.ccc">发送邮件：要求用户机器上安装邮件发送软件</a>
<!--拨号-->
<a href="tel:12345678945">拨号：要求用户机器上安装拨号软件，或是使用移动端访问</a>

a元素target属性

在这里插入图片描述

iframe元素

也叫框架页。

属于可替换元素。

默认属block: inline
通常显示的内容取决于元素的属性
CSS不能完全控制其中的样式
具有行块盒可以控制宽高的特性

<a href="https://www.baidu.com" target="myframe">百度</a>
<a href="https://www.bilibili.com" target="myframe">B站</a>
<!--初始iframe里显示百度的页面-->
<iframe name="myframe" src="https://www.baidu.com"></iframe>

iframe常用于在自己的页面中嵌入其他网站的视频资源。

img元素

属性：

src，图片地址
alt，图片说明

和a元素联用

<!--点击图片跳转链接-->
<a target="_blank" href=""><img src="" alt=""></a>

和map标签链接

<!--划分图片中的区域，点击某个区域的时候跳转-->
<img usemap="#solarMap">
<map name="solarMap">
	<area shape="circle/rect/poly" coords="centerX, centerY, radius/left-top, right-bottom/X1, Y1, X2, Y2" href="url" alt="" target="">
</map>