首页 > 其他分享> 文章详细

HTML <a>等元素

2021-09-21 17:35:56 阅读：181 来源： 互联网

标签：包含元素 list controls HTML 跳转属性

　　#<a>元素 <body> <a href=""></a> </body>

　　href 属性
href 跳转地址：

href 跳转到某个锚点（页面某个位置）
快速输入内容：（(h2>{内容$})+p>lorem）*6
a>(内容$)*6

设置锚点：a跳转到h2
<a href="#charpter1">第一章</a>
<h2 id = "charpter1">第一章</h2>

快速输入
((h2[id="charpter$"]>{章节$})+p>lorem100)*6
快速回到顶部
<a href="#">回到顶部</a>

href 功能性链接：点击后触发某功能
执行js代码
<body>
<a href="javascript:alert('你好')">
弹出你好
</a>
</body>

发送邮件 mailto
<a href="mailto:123@qq .com">点我发送邮件</a>

拨打点号 tel，手机端触发

<a href="tel:+"></a>
<a href="tel：1853333">给我打电话</a>

target属性

表示跳转窗口位置
1、_self:覆盖当前页面
2、_blank 新窗口打开

title属性
全局属性：提示文字

　　#多媒体元素
video支持：MP4、webm

<video src="url" style="width: 50px" controls="controls" autoplay></video>

audio元素用法同video元素，支持mp3

<audio src=""></audio>

旧版本浏览器不支持video和audio，处理方式

<video style="width: 50px" controls="controls" autoplay muted>
    <source src="格式1">
    <source src="格式2">
</video>

　　#列表元素
有序列表
　　ol： ordered list
　　li： list items

<ol type="I">
<li></li>
</ol>

默认排序为阿拉伯数字，用type属性改变（I i A a 1）如type="i";
***应使用 CSS 的 list-style-type属性设置排序格式

ol 的属性 reversed布尔属性倒序排列

无序列表
　　ul unordered list

<ul>
<li></li>
</ul>

***选中代码按ctrl +shift + 向上键快速复制

定义列表
　　dl： definition list
　　dt： definition title
　　dd： definition description

<dl>
    <dt>THML</dt>
    <dd>超文本标记语言</dd>
    <dt>元素</dt>
    <dd>HTML单元</dd>
</dl>

　　#容器元素
该元素代表一个块区域，用于放置其他元素
div元素
ul>li*4>lorem1快速输入内容

语义化元素
header 可以用于表示网站或文章头部，套div等
footer 用于页角或文章底部
article 用于表示整片文章
section 用于表示文章的一章内容
aside用于表示侧边栏

元素包含关系
以前：块级元素包含行级元素，行级元素不可以包含块级元素，a元素除外
现在：元素的包含关系由元素的内容类别决定

查包含文档例如搜索 h1 mdn

总结：
1、容器元素中可以包含任何元素
2、a元素几乎可以包含任何元素
3 、某些元素只能包含固定的子元素（ul>li; ol>li; dl>dt>dd），
4 、标题元素不能包含段落元素，并且不能包含容器元素

标签：包含,元素,list,controls,HTML,跳转,属性
来源： https://www.cnblogs.com/perfectdata/p/15307042.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

HTML <a>等元素