Web前端HTML5+CSS3知识点（3）语义化标签

1. 概述

html :负责结构

应该关注他的语义，而不是表现（长什么样子）

css: 负责表现 H1  H2

2. 标题标签 6级

H1-H6 重要性递减。H1最重要，仅次于title ,一般情况标题标签只会使用到H1-H3， H4-H6很少用。

在页面中独占一行，称为块元素。

注意hgroup的使用，把标题放到一起。

3.P标签

表示一个段落，是有间距，标题标签都是块元素。

注意:em标签用于语音语义的加重。（表现是变为斜体，但是表现不重要），注意他是行内元素，不独占一行。

strong表示强调，重要内容。注意语义。

 blockquto： 长引用。

q: 行内：短引用。

4. 块元素和行元素

     块元素：一般用于布局。

     行元素：一般用于包裹“文字”，一般会在“块”放“行”，反之很少。

     浏览器在解析网页时候，写的再烂，也会进行修正。p元素中不能放任何的块元素

5.布局标签（结构化标签）

<header> 表示头部。

<main> 表示网页的主体的部分（一个页面中只会有一个main）

<footer> 表示底部。  用的频度不是很大（H5）

<nav> 表示网页中的导航。

<aside>和主体相关的其他内容（侧边栏）

<article> 表示文章。

<section> 表示一个独立的区块。上面标签都不能表示，就使用section

<div> 没有语义，就是表示一个区块，目前来讲，还是我们主要的布局元素。

<span> 行内元素，无语义，一般用于网页中选中文字。

6. 列表标签

列表：list

1. 有序 OL

2.无序 UL

3.定义列表 DL :使用DT来定义内容(或项目），dd来对内容进行解释。