HTML表格，列表，表单

HTML是什么？

HTML的全称为超文本标记语言，是一种标记语言。它包括一系列标签2．通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文本，图形、动画、声音、表格、链接等。

HTML 标题

<h1>这是一个标题</h1>

<h2>这是一个标题</h2>

<h3>这是一个标题</h3>

HTML 段落

<p>这是一个段落。</p>

<p>这是另外一个段落。</p>

HTML 链接

<a href="https://www.baidu.com">这是一个链接</a>

HTML 图像

<img loading="lazy" src="/images/logo.png" width="258" height="39" />

HTML 表格

表格由 <table> 标签来定义。每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。

表格实例

实例

<center>课程表</center>
    <table border="3px" bordercolor="blue" align="center">
        <tr>
            <td>项目</td>
            <td colspan="5" align="center">上课</td>
            <td colspan="5" align="center">休息</td>
        </tr>

        <tr>
            <td>星期</td>
            <td>星期一</td>
            <td>星期二</td>
            <td>星期三</td>
            <td>星期四</td>
            <td>星期五</td>
            <td>星期六</td>
            <td>星期日</td>
        </tr>

        <tr>
            <td rowspan="4">上午</td>
            <td>语文</td>
            <td>数学</td>
            <td>英语</td>
            <td>英语</td>
            <td>物理</td>
            <td>计算机</td>
            <td rowspan="4">休息</td>
        </tr>

        <tr>
            <td>数学</td>
            <td>数学</td>
            <td>地理</td>
            <td>历史</td>
            <td>化学</td>
            <td>计算机</td>
        </tr>

        <tr>
            <td>化学</td>
            <td>语文</td>
            <td>体育</td>
            <td>计算机</td>
            <td>英语</td>
            <td>计算机</td>
        </tr>


        <tr>
            <td>政治</td>
            <td>英语</td>
            <td>体育</td>
            <td>历史</td>
            <td>地理</td>
            <td>计算机</td>
        </tr>


        <tr>
            <td rowspan="2">下午</td>
            <td>语文</td>
            <td>数学</td>
            <td>英语</td>
            <td>物理</td>
            <td>计算机</td>
            <td>英语</td>
            <td rowspan="2">休息</td>
        </tr>

        <tr>
            <td>数学</td>
            <td>数学</td>
            <td>地理</td>
            <td>历史</td>
            <td>化学</td>
            <td>计算机</td>
        </tr>



    </table>

HTML无序列表

 <ul>
        <li><a href="#">俄驻华大使</a></li>
        <li><a href="#">县委书记</a></li>
        <li><a href="#">加勒比海</a></li>
        <li><a href="#">干部开会睡觉</a></li>
    </ul>

HTML 有序列表

<ol>
<li>YYY</li>
<li>HHH</li>
</ol> 

HTML <div> 元素,HTML <span> 元素 

 <div>国内新闻<div>
 <span>案列说明：第一锚点，链接到锚点</span>

HTML 表单

表单是一个包含表单元素的区域。

表单元素是允许用户在表单中输入内容,比如：文本域(textarea)、下拉列表、单选框(radio-buttons)、复选框(checkboxes)等等。

表单使用表单标签 <form> 来设置:

<form class="Box">
        <div>
            <img src="images/logo.png" class="logo">
            <h2>用户注册</h2>
        </div>
        <ul>
            <li>
                <label>用户名称：</label><input type="text" placeholder="请输入您的用户名！" class="txtBox">
            </li>
            <li>
                <label>登录密码：</label><input type="password" placeholder="请输入您的密码！" class="txtBox">
            </li>
            <li>
                <label>重复密码：</label><input type="password" placeholder="请输入您的确认密码！" class="txtBox">
            </li>
            <li>
                <label>电子邮箱：</label><input type="text" placeholder="请输入您的邮箱！" class="txtBox">
            </li>
            <li>
                <label>性&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp别：</label>
                <input type="radio" name="sex" class="sex" value="checkbox">男<input type="radio" name="sex" value="checkbox">女
            </li>
            <li>
                <label>职&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp业：</label>
                <select style="width: 300px;" value="1" class="txtBox">
                    <option value="1">学生</option>
                    <option value="2">教师</option>
                </select>
            </li>
            <li>
                <label>爱&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp好：</label>
                <textarea name="" id="" cols="36" rows="10"></textarea>
            </li>
        </ul>
        <hr/>
        <div>
            <button class="btn">注册</button>
            <button class="btn">重置</button>
        </div>
        <div class="footer">
            <span>1097329810&copy;.2017-轻实训调版权所有</span>
        </div>
    </form>