ife-task1:零基础HTML编码--HTML语义化

HTML 是一种标记语言
HTML 标签：标记了html文档和元素
HTML 元素：从开始到结束标签的所有代码，是基本的构造区块
HTML 属性:一般都在开始标签中定义，名称/值形式出现
HTML 之前遗忘的标签：这些标签都是为了更好的语义化，语义化方便爬虫等分析

1.nav标签

<nav> :导航栏（横竖均可），用于link other pages

<nav>    <ul>        <li></li>        <li></li>        <li></li>    </ul></nav>

2.文章结构标签

对一些表示块的标签应用的不是很多，导航用nav，头部用header，文章用article， 区块用section，插入图片用figure，侧边栏用aside，正确的使用这些标签无疑能让 代码的可读性更高，结构性更强

<article> :定义外部的内容，外部内容可以是来自外部的新闻提供者的一篇新的文章或者是来自blog的文本

<header>:定义文档的页眉；对应<footer>定义文章的页脚

<aside> 标签定义 article 以外的内容。aside 的内容应该与 article 的内容相关。<aside> 的内容可用作文章的侧栏。

<section>    <header>        <h1></h1>        ......        <h6></h6>    </header>    <aside>    </aside>    <article>        <p></p>    </article>    <footer>    </footer></section>

3.图片排列标签

  <figure>:用作文档中插图的图像  <figcaption>:定义figure元素的标题caption

<figure>    <figcaption>标题</figcaption>    <img src=""/>    ......    <figcaption>标题</figcaption>    <img src=""/></figure>

4.table标签

<table>    <thead>        <tr>            <th></th>            ......        </tr>    </thead>    <tbody>        <tr>            <td></td>            ......        </tr>        ......    </tbody>    <tfoot>        <tr>            <td></td>            ......        </tr>    </tfoot>

5.表单标签

表单会用到的标签<form>

<span> 标签被用来组合文档中的行内元素。

<em>和<strong>标签是为了强调一段话中的关键字时使用，它们的语义是强调。

<span>标签是没有语义的，它的作用就是为了设置单独的样式用的。

<input>文本，单选，多选，提交按钮

<label>主要用于绑定一个表单元素，当点击label便签的时候，被绑定的表单元素就会获得焦点,和其他表单元素比如input一起使用      <input type="radio" name="sex" id="male"/>      <label for="male">男</label>      <input type="radio" name="sex" id="female"/>      <label for="female">女</label>

<textarea>多行文本

<select>下拉框选择；input标签的属性placeholder，pattern 属性规定用于验证输入字段的模式，模式指的是正则表达式pattern="[0-9A-Za-z]{6,16}"

<fieldset>表单内相关元素分组，可以将表单一部分内容打包，生成一组相关表单的字段legend 元素为 fieldset 元素定义标题（caption）。