html标签1

2022-09-19 08:52:26

章节标签：表示文章的层级

标题 h1~h6
章节 section
文章 article
段落 p
头部 header
脚部 footer
主要内容 main
旁支内容 aside
划分 dib

全局属性：所有标签都有的属性

class：给你的标签标记或者分类
contenteditable：使元素可编辑，它几乎支持所有的HTML元素
hidden：可以使一个标签不被显示
id：定义了一个全文档唯一的标识符，不到万不得以不使用。JS中可直接调用id属性
style：通常用来访问CSS的属性列表
tabindex：指示其元素是否可以聚焦，以及它是否/在何处参与顺序键盘导航，通常使用Tab键
title：显示完整内容

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
  <style>
      .middle{
          background: black;
          color: white;
      }
      .bordered {
          border: 10px solid red;
      }
      #xxx{
          border: 10px solid yellow;
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis;
      }
  </style>
</head>

<body>
  <header id="xxx" style="border: 10px solid green" title="远远地回首过去的自己无限感伤"> 
    <!-- 此处的style为HTML覆盖了17行的CSS，同样JS也会覆盖HTML   -->
    顶部广告:命运的转轮不停地旋转
    但是我一直守候你
    为何我如此三生有幸
    每见到水平线 便有莫名哀伤
  </header>
  <div class="middle bordered">
    <main>
      <h1>文章标题</h1>
      <section>
        <section>
          <h2>第一章</h2>
          <p>不要认输</p>
        </section>

        <section>
          <h2>第二章</h2>
          <p>摇曳的思念</p>
        </section>
      </section>
    </main>
    <aside>
      参考资料 1 2 3
    </aside>
  </div>
  <footer>&copy; 饥人谷版权所有</footer>
</body>

</html>

html标签1

码农公寓

相关文章