超链接标签
文本超链接
id 属性可用于创建一个 HTML 文档书签
提示: 书签不会以任何特殊方式显示,即在 HTML 页面中是不显示的,所以对于读者来说是隐藏的。
<!-- a标签
href:必填,表示要跳转到那个页面得地址
target:表示窗口在哪里打开
_blank 在新标签页面打开
_self 在自己网页中打开
_parent
_top
-->
<a href="图像标签.html" target="_blank">点击我跳转</a>
<a href="https://www.baidu.com" target="_self">点击我跳转</a>
锚链接
<!--
锚链接(页面间的跳转)
1.需要一个标记 (#名字)<a name="down">底部</a>
2.跳转到标记 <a href="链接标签.html#down">到链接底部</a>
-->
功能性链接
<!--功能性链接
1.邮件链接:mailto:
2.qq链接 qq推广
-->
<a href="mailto:2264512689@qq.com">点击联系我</a>
行内元素和块元素
块元素
- 无论内容多少,该元素独占一行
- (p,h1-h6)
行内元素
- 内容撑开宽度,左右都是行内元素的 可以排在一行 不会换行
- (a,strong,em等…)
列表
<!--有序列表 ol-->
<ol>
<li>java</li>
<li>c/c++</li>
<li>测试</li>
<li>前端</li>
<li>Python</li>
</ol>
<hr/>
<!--无序列表 ul
应用范围:导航,侧边栏
-->
<ul>
<li>java</li>
<li>c/c++</li>
<li>测试</li>
<li>前端</li>
<li>Python</li>
</ul>
<!--自定义列表
dl:标签
dt:列表名称
dd:列表内容
-->
<dl>
<dt>学科</dt>
<dd>java</dd>
<dd>c/c++</dd>
<dd>测试</dd>
<dd>前端</dd>
<dd>Python</dd>
<dt>位置</dt>
<dd>湖南</dd>
<dd>广东</dd>
<dd>四川</dd>
</dl>
提示: 列表项内部可以使用段落、换行符、图片、链接以及其他列表
标签 | 描述 |
---|---|
ol | 定义有序列表 |
ul | 定义无序列表 |
li | 定义列表项 |
dl | 定义列表 |
dt | 自定义列表项目 |
dd | 定义自定列表项的描述 |
表格
<!--表格table
行 tr rows
列 td col
跨列 colspan
跨行 rowspan
-->
table | 定义表格 |
---|---|
th | 定义表格表头 |
tr | 定义表行 |
td | 定义表列 |
caption | 定义表格标题 |
colgroup | 定义表格列的组 |
col | 定义表格列的属性 |
thead | 定义表眉 |
tbody | 定义表格主体 |
媒元素
媒元素
视频元素video
<body>
<!--视频
src:资源路径
controls:控制进度条 开关 下载
autoplay:自动播放
和音频
-->
<video src="../resource/1626599304297.mp4" controls autoplay></video>
<audio src=""></audio>
</body>
音频元素audio
页面结构分析
元素名 | 描述 |
---|---|
header | 标记头部区域的内容(用于页面或页面的一块区域) |
footer | 标记脚步的区域内容(用于整个页面或页面的一块区域) |
section | web页面中的一块独立区域 |
article | 独立文章的内容 |
aside | 相关内容或应用(用于侧边栏) |
nav | 导航类辅助内容 |
iframe内联框架
不希望被嵌套可以:X-Frame-Options
三个可配置:
DENY:表示该网站页面不允许被嵌套,即便是在自己的域名的页面中也不能进行嵌套。
SAMEORIGIN:表示该页面可以在相同域名页面中被嵌套展示。
ALLOW-FROM uri:表示该页面可以在指定来源页面中进行嵌套展示。
<body>
<!--内联框架
链接可以调到指定的看框架
src:地址
width:宽度
height:高度
-->
<iframe src="" name="xixi" frameborder="0" width="1000" height="800"></iframe>
<a href="6.表格.html" target="xixi">跳转</a>
</body>