块标签,行标签,表格,表单,下拉,多选

<!DOCTYPE html>  
<html>  
    <head>  
        <meta charset="utf-8">  
    </head>  
    <body>  
        <!--块标签  独占一行  
        align:center 设置块标签  才有效果  
        -->  
        <a href="">链接</a>  
        <div align="center">aaaaaaaaaaa</div>  
        <!--行内标签  根据内容大小来占位-->  
        <i align="center">aaaaa</i><b>ddddd</b>  
   
        <span>spanspan</span>  
   
   
<!--表格标签 table border表格边框  width表格宽度  
        cellpadding:单元格与内容之间的间距  
        cellspacing:单无格与单元格之间的间距  
        -->  
        <table border="1" cellpadding="0" cellspacing="0"width="500"text-align="center">  
            <!--表格标题标签 caption-->  
            <caption>学生信息表</caption>  
            <!--行标签  tr-->  
            <!--列标签  td th默认加粗居中效果-->  
            <tr>  
                <td>姓名</td>  
                <th>年龄</th>  
                <th>性别</th>  
            </tr>  
            <tr>  
                <td>1</td>  
                <td>2</td>  
                <td>3</td>  
            </tr>  
        </table>  
   
   
   
<h3>表单标签---form</h3>  
        <form action="./form.php">  
            <!--  
            表单项 input  
            type类型:1.text 文本框  name  
                      2.password 密码框 name  
                      3.radio  单选按钮  name名称相同 value值不同 value值尽量使用数字  
                      4.checkbox 多选按钮 name名称不同 like[] value属性  
                      5.file 上传  
                      6.按钮:submit,image(按钮图片) 提交按钮  
                              button普通按钮 reset重置  
                      7.hidden 隐藏域  
                    单选按钮和多选框 默认选中都使用checked属性  
                      
            -->  
            <input type="hidden" name="id" value="2">  
            用户名:<input type="text" name="user"><br><br>  
            密码:<input type="password" name="pass"><br><br>  
            性别:<input type="radio" name="sex" value="0">男  
                  <input type="radio" name="sex" value="1" checked>女  
                  <input type="radio" name="sex" value="2">保密  
                <br><br>  
            爱好:<input type="checkbox" name="aihao[]" value="0" checked>看小说  
                  <input type="checkbox" name="aihao[]" value="1" checked>吃饭  
                  <input type="checkbox" name="aihao[]" value="2">睡觉  
                  <input type="checkbox" name="aihao[]" value="3">打豆豆  
                <br><br>  
            上传头像:<input type="file" name="pic"><br><br>  
              
            <input type="submit" value="登录">  
            <input type="image" src="./button.gif">  
            <input type="button" value="提交">  
            <input type="reset" value="重写">  
        </form>  
   
   
   
   
<!--action 提交地址  method 提交方式  默认是get方式 post 
        -->  
        <form action="" method="post">  
            <!--  
            input表单项属性  
                value 可以给文本框默认值  
                size  可以调整输入框的宽度  
                maxlength 可以输入内容的最大长度  
                readonly 只读 只能看 不能修改 会随着表单提交  
                disabled 禁用 只能看 不能修改 不随表单项一起提交  
            -->  
            主机名:<input type="text" name="username" value="localhost" size="10"><br><br>  
            用户名:<input type="text" name="username" maxlength="5"><br><br>  
            readonly只读:<input type="text" name="username" value="kankaneryi" readonly><br><br>  
            disabled禁用:<input type="text" name="username" value="kankaneryi" disabled><br><br>  
              
            <input type="submit" value="登录">  
        </form>  
   
   
<!--select 下拉选项 name  
            option  value  
            默认选中 selected  selected="selected"  
              
            多行文本域  
                textarea  
                name 必选  
                默认值 在两个标签之间  
                rows 行  
                cols 列  
        -->  
        <form action="">  
            学历:<select name="edu">  
                    <option value="0">小学</option>  
                    <option value="1">初中</option>  
                    <option value="2" selected>大学</option>  
                    <option value="3">博士后</option>  
                    <option value="4">未来战士</option>  
                  </select><br><br>  
            个人简介:<textarea name="grjs" rows="6" cols="30">这个人很懒..什么也没有留下</textarea><br><br>  
            <input type="submit" value="登录">  
        </form>  
   
   
<fieldset>  
        <legend>健康信息:</legend>  
        身高:<input type="text" /><br/>  
        体重:<input type="text" /><br/>  
    </fieldset>  
    </body>  
</html>  

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值