HTML5标签

最新推荐文章于 2024-06-27 14:36:29 发布

aomize

最新推荐文章于 2024-06-27 14:36:29 发布

阅读量382

点赞数

分类专栏： HTML 文章标签： html5 标签

本文链接：https://blog.csdn.net/aomize/article/details/77489934

版权

下面是HTML5中新增的一些标签

article

定义和用法：article 标签规定独立的自包含内容

一篇文章应有其自身的意义，应该有可能独立于站点的其余部分对其进行分发。

article元素的潜在来源：
论坛帖子
报纸文章
博客条目
用户评论

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <style type="text/css">
    .article {
        background: #999;
    }
    .info {
        overflow: hidden;
        white-space: nowrap;
    }
    </style>
</head>
<body>
    <article class="article">
        <h3 class="title">html标签</h3>
        <p class="info">什么是html标签？html标签是用来干什么的？</p>
    </article>
</body>
</html>

注：Internet Explorer 8 以及更早的版本不支持 article标签

aside

定义和用法：aside标签定义其所处内容之外的内容。

aside 的内容应该与附近的内容相关

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <style type="text/css">
    .aside {
        width: 200px;
        height: 300px;
        padding: 40px 0;
        box-sizing: border-box;
        border-right: 2px solid #999;
    }
    .aside_item {
        list-style: none;
        text-align: center;
    }
    .aside_item__link {
        display: block;
        height: 30px;
        line-height: 30px;
        padding: 5px 0;
        text-decoration: none;
        color: #333;
        font-size: 18px;
    }
    .aside_item__link:hover {
        color: #fff;
        background: #999;
    }
    </style>
</head>
<body>
    <aside class="aside">
        <li class="aside_item"><a class="aside_item__link" href="#">首页</a></li>
        <li class="aside_item"><a class="aside_item__link" href="#">新闻中心</a></li>
        <li class="aside_item"><a class="aside_item__link" href="#">消息中心</a></li>
        <li class="aside_item"><a class="aside_item__link" href="#">联系我们</a></li>
    </aside>
</body>
</html>

这里写图片描述

注：
（1）aside的内容可用作文章的侧栏
（2）Internet Explorer 8 以及更早的版本不支持 aside 标签

audio标签

定义和用法：audio 标签定义声音，比如音乐或其他音频流

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>audio标签</title>
</head>
<body>
    <audio src="萧忆情 - 童话镇.mp3" controls="controls"></audio>
</body>
</html>

这里写图片描述

canvas

定义和用法：canvas标签定义图形，比如图表和其他图像。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>canvas标签</title>
</head>
<body>
    <canvas id="myCanvas"></canvas>

最低0.47元/天解锁文章

aomize

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
HTML5标签

HTML5中废弃的标签articleasideaudiohtml lang="en">head> meta charset="UTF-8"> title>title>head>body> audio src="萧忆情 - 童话镇 [mqms2].mp3" controls="controls">audio>body>html>bdi
复制链接

扫一扫