2020-12-28

程序员文章站 2022-03-12 21:41:41

HTML的标签类型容器标签：容器标签总是成对出现格式：<开始标签>内容单边标签：单边标签只有开始标签，没有结束标签HTML的组成最简单的HTML的组成这里是网页的标题

HTML的标签类型

容器标签：容器标签总是成对出现
格式：<开始标签>内容</结束标签>
单边标签：单边标签只有开始标签，没有结束标签

HTML的组成

最简单的HTML的组成

<html lang="en">
<head>
<!--    head用来放置网页相关信息-->
    <meta charset="UTF-8">
    <title>这里是网页的标题</title>
</head>
<body>
这里是网页的内容
</body>
</html>

标签属性的运用
有些标签可以加上属性Attibute,标签的属性是不区分大小写的
例如

<html lang ="zh-cn"><!-- 指定语言-->

使用meta标签描述网页有利于搜索引擎快速找到网站并分类

 <meta charset="UTF-8" name="keyword" content="HTML,CSS,XHTML,JavaScript">

标签	说明
header	显示网站名称、主题或者主要信息
hgroup	将网页的标题分组，通常以h1到h6标签区分标题、副标题
nav>	网站的链接菜单
aside	用于侧标栏
article	用于定义主内容区
section	用于章节或段落
footer	位于页尾，用来放置版权声明，备案，作者信息等

具体实践（开发环境为IDEA）

<html lang="en">
<head>
<!--    head用来放置网页相关信息-->
    <meta charset="UTF-8" name="keyword" content="HTML,CSS,XHTML,JavaScript">
    <title>某网友因为白嫖up主视频被抓</title>
</head>
<body>
<header id="header">
    <hgroup>
        <h1>震惊！某网友因为白嫖up主视频被抓</h1>
        <h3>据悉，该网友已是多次白嫖</h3>
    </hgroup>
    <nav>
        <ul>
            <li><a href="#" >如何吸引富婆</a></li>
            <li><a href="#" >如何让甲方崩溃</a></li>
            <li><a href="#" >如何白嫖up的视频</a></li>
            <li><a href="#" >b站关注胖大海fff</a></li>
        </ul>
    </nav>
</header>
<article>
    <section>
        <h2>如果我是DJ你会爱我吗？</h2>
        <p>滴锥嗨起来</p>
        <p>滴锥嗨起来！</p>
    </section>
    <aside>
        <figure>
            <img alt="海绵宝宝" src="https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=2766405492,4103825618&fm=26&gp=0.jpg">
        </figure>
    </aside>
</article>
<footer>
    这是网页的底部,用来放备案版权和网页拥有者的信息
    关注b站胖大海fff
</footer>
</body>
</html>

2020-12-28

本文地址：https://blog.csdn.net/weixin_45413070/article/details/111875923