HTML

标签

<meta charset="UTF-8>
<meta name="keywords" content="">
<meta name="description" content="">

标题标签

<h1>...</h1>

段落标签

<p> ...</p>

换行标签

<br/>

水平线标签

<hr/>

字体样式标签

<!-- 粗体 -->
<strong>...</strong>
<!-- 斜体 -->
<em>...</em>

注释和特殊符号

<!-- 空格 -->
...&nbsp;...
<!-- 大于  -->
&gt;
<!-- 小于 -->
&lt;
<!-- 版权 -->
&copy;

图像

<!-- 地址、名称、悬停文字、高度、宽度 -->
<img src="" alt="" title="" height="" width="">

超链接

<!-- target:打开方式 -->
<a href="" target="_blank">....</a>


<a name="top">顶部</a>
<!--跳转页面 -->
<a href="#top">回到顶部</a>

列表标签

<!--有序列表-->
<ol>
    <li>java</li>
    <li>Python</li>
    <li>C++</li>
</ol>

<!--无序列表-->
<ul>
    <li>java</li>
    <li>Python</li>
    <li>C++</li>
</ul>

<!--自定义列表-->
<dl>
    <dt>编程语言</dt>
    <dd>Java</dd>
    <dd>Python</dd>
    <dd>C++</dd>
</dl>

#### 表格标签

<!--表格-->
<table border="2px">

    <tr>
    <!-- 跨列 -->
        <td colspan="3">学生成绩</td>
    </tr>

    <tr>
    <!-- 跨行 -->
        <td rowspan="2">琴江</td>
        <td>语文</td>
        <td>100</td>
    </tr>

    <tr>
        <td>语文</td>
        <td>100</td>
    </tr>

    <tr>
        <td rowspan="2">琴江</td>
        <td>语文</td>
        <td>100</td>
    </tr>

    <tr>
        <td>语文</td>
        <td>100</td>
    </tr>
</table>

媒体标签

<video src="" controls autoplay></video>
<audio src=""></audio>

页面结构分析

• header：标题头部区域内容
• footer: 标记脚部区域的内容
• section：Web页面中的一块独立区域
• article: 独立文章内容
• aside: 相关内容应用
• nav: 导航类

Iframe内联框架

<iframe src="..." frameborder="0></iframe>

表单

<!-- action：跳转的页面 method: 发送表单方式 post / get-->
<form method="post" action="">
    <!-- type: 文本框 value：默认值 -->
    <p> 用户名：<input type="text" name="UserName" value="zcs" maxlength="8" size="30" placeholder="请输入用户名" required></p>

    <!-- 密码 -->
    <P> 密码：<input type="password" name="PassWord"></P>



    <p>性别
        <input type="radio" value="boy" name="sex"/>男
        <input type="radio" value="girl" name="sex"/> 女
    </p>

    <p>爱好
    <!-- 多选 -->
        <input type="checkbox" value="a" name="hobby">睡觉
        <input type="checkbox" value="a" name="hobby">睡觉
        <input type="checkbox" value="a" name="hobby">睡觉
    </p>

    <p>按钮
        <input type="button" name="btn1" value="button" disabled>
        <input type="image" src="../resource/1.jpg" width="300" height="300">
    </p>

    <p>
        <input type="submit" title="提交">
        <input type="reset"  title="重置">
    </p>

    <p>下拉框
        <select name="列表名称">
            <option value="选项">abcdefg</option>
            <!-- 默认 -->
            <option value="选项" selected>abcdefg</option>
            <option value="选项">abcdefg</option>
            <option value="选项">abcdefg</option>
        </select>
    </p>

    <P>反馈
        <textarea name="textarea" cols="10" rows="20">text</textarea>
    </P>

    <p>
    <!-- 文件上传 -->
        <input type="file" name="files">
        <input type="button" name="upload">上传
    </p>

    <p>邮箱：
        <input type="email" name="email">
    </p>

    <p>URL：
        <input type="url" name="url">
    </p>

    <p>number：
        <input type="number" name="number">
    </p>

    <p>
        <input type="submit" title="提交">
        <input type="reset"  title="重置">
    </p>

    <p>滑块：
        <input type="range" name="voice" min="0" max="100" step="2">
    </p>

    <p>search：
        <input type="search" name="search">
    </p>
</form>