html2

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!-- 关键字 供搜做引擎用-->
    <meta name="keyword" content="xxx,xxx">
    <!-- 网页描述 在网页上显示-->
    <meta name="description" content="xx,xx,xx,xx">
    <!-- 网页重定向  5秒跳转一次 -->
    <!-- <meta http-equiv="refresh" content="5; http//:www.xiaomi.com"> -->
    <link rel="stylesheet" href="">
    <!-- 浏览器上面显示的图标 -->
    <link rel="icon" href="xx/xx.icon">
    <title>Document</title>
</head>
<body>
    <!-- border是边框,cellspacing是单元格之间的距离 -->
    <!-- cellpadding是内容到边框的距离 -->
    <!-- allign:left,right,center -->
    <!-- bgcolor:背景颜色 -->
    <!-- valign内容垂直 top middle bottoms-->
    <table border="5" width="500" height="100" cellspacing="20" cellpadding="15" align="center" bgcolor="red">
        <tr>
            <td align="center">1,1</td>
            <td valign="top">1,2</td>
            <td>1,3</td>
        </tr>
        <tr>
            <td>2,1</td>
            <td>2,2</td>
            <td>2,3</td>
        </tr>
    </table>
    <!-- table标准结构 -->
    <!-- thead是头部 -->
    <!-- tbody表示身体 -->
    <!-- tfoot表示脚 -->
    <!-- 这三个只是一个标记,在里面写属性没有,要在tr,td里写 -->
    <table border="10" width="500" height="300" align="center">
        <thead>
            <tr>
                <td></td>
                <td></td>
                <td></td>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td></td>
                <td></td>
                <td></td>
            </tr>
        </tbody>
        <tfoot>
            <tr>
                <td></td>
                <td></td>
                <td></td>
            </tr>
        </tfoot>
    </table>

    <!-- caption表示表头,自动居中 -->
    <!-- colspan横向合并 rowspan纵向合并 -->
    <!-- th是表格标题 和td用法一样-->
    <table align="center" border="4" height="300" width="500">
        <caption>表头</caption>
        <tr>
            <th colspan="2" rowspan="2"></th>
            <td></td>
        </tr>
        <tr>
            <td></td>
        </tr>
        <tr>
            <td></td>
            <td></td>
            <td></td>
        </tr>
    </table>
    <!-- 细线表格 -->
    <!-- 思路:table表格设置背景色作为细线颜色,设置celspacing为1,每个单元格设置为白色 -->
    <!-- bgcolor是背景颜色,bordercolder是边框颜色 -->
    <table width="500" height="300" bgcolor="red" align="center" cellspacing="1">
        <tr bgcolor="white">
            <th colspan="2"></th>
            <th>星期一</th>
            <th>星期二</th>
            <th>星期三</th>
            <th>星期四</th>
            <th>星期h</th>
        </tr>
        <tr bgcolor="white">
            <td rowspan="2">上午</td>
            <td>1</td>
            <td>语文</td>
            <td>数学</td>
            <td>物理</td>
            <td>化学</td>
            <td>生物</td>
        </tr>
        <tr bgcolor="white">
            <td>2</td>
            <td>体育</td>
            <td>音乐</td>
            <td>几何</td>
            <td>画画</td>
            <td>舞蹈</td>
        </tr>
    </table>

    <!-- input属性:maxlength和minlength限定输入输出最大最小字符 -->
    <input type="text" maxlength="" minlength="">
    <!-- multiple="multiple" 多选 -->
    <!-- optgroup是分组 -->
    <select name="" id="" multiple="multiple">
        <optgroup label="数字">
            <option value="">1</option>
            <option value="">2</option>
            <option value="">3</option>
        </optgroup>
        <optgroup label="字母">
            <option value="">a</option>
            <option value="">b</option>
            <option value="">c</option>
        </optgroup>

    </select>

    <fieldset>分组
        <legend>分组信息</legend>
        <form action="">
            <input type="text">
        </form>
    </fieldset>
    <!-- 输入网址,日期,时间,邮件,数字的的控件  -->
    <input type="url">
    <input type="data">年月日
    <input type="time">几点几分
    <input type="email">邮件
    <input type="number" step="5">数字
    每次增加5个1+5+5+5...
    <!-- 滑块控件 --><!-- 一次滑50 -->
    <input type="range" step="50">
    
</body>
</html>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值