HTML 等元素

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

  href 属性
href 跳转地址:

<a href="url"></a>

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属性

<a href="http://" target="_blank" rel="noopener noreferrer"></a>

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

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

 

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

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

<!--
控件属性controls: controls="controls" 只能是这种形式
某些属性只有两种状态:1不写, 2取值为属性名,这种属性称为布尔属性
布尔属性在html5中,可以不写属性值
如autoplay布尔属性,自动播放 muted布尔属性 静音播放 controls显示控件 loop循环播放等
-->

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 、标题元素不能包含段落元素,并且不能包含容器元素

上一篇:Lab: Inconsistent security controls:不一致的安全控制


下一篇:Qt 6 Quick QML (包括PySide,QtCreator)的各种坑