Html-语义话标签

一、语义话标签

  header:头部

  article: 主体部分 

  aside:主体的附属信息,一般都是放侧边栏

  section:内容区域

  footer:页脚

二、功能性标签

  address:作者信息

  progress:进度条

  mark:标记

  dialog:定义一段对话

  datalist:选项列表

****************************基本HTML页面结构

<script type="text/javascript">

  document.createElement('header');
  document.createElement('article');
  document.createElement('aside');
  document.createElement('section');
  document.createElement('footer');

</script>
<style>
*{margin:0;padding:0;}
header{100%;height:100px;background:red;display: block;}
article{ 100%;height:500px;background:darkgrey;display: block;}
aside{40%;height:100%;background:darkgoldenrod;float: left;display: block;}
section{60%;height:100%;background:cadetblue;float:right;display: block;}
footer{100%;height:100px;background: yellow;display: block;}
</style>
</head>
<body>
  <header>头部</header>
  <article>
    <aside>侧边栏</aside>
    <section>内容部分</section>
  </article>
  <footer>尾部</footer>
</body>

原文地址:https://www.cnblogs.com/xiaoyangtian/p/7978800.html