HTML 表格

html 复制代码
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>表格标签</title>


  /*  <style>
        .yun {
            width: 140px;
            height: 48px;

        }
    </style>*/
</head>

<body>
    <table border="1px" cellspacing="0" width="600px">
        <tr>
            <th>序列号</th>
            <th>品牌Logo</th>
            <th>品牌名称</th>
            <th>企业名称</th>

        </tr>
        <tr>
            <td>1</td>
            <td><img src="写入图片路径" alt=""></td>
            <td>华为</td>
            <td>华为技术有限公司></td>
        </tr>

        <tr>
            <td>2</td>
            <td><img src="写入图片路径" class="yun"></td>
            <td>阿里</td>
            <td>阿里巴巴集团控股有限公司></td>
        </tr>
    </table>
</body>

</html>

border="1px" 是表格的线条 1像素

cellspacing="0" 是两个线条的距

<th>序列号</th> 单元格字体加租剧中显示

<td>1</td> 是普通单元格

效果

表单标签

html 复制代码
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>表单标签</title>
    <style>

    </style>
</head>

<body>

    <form action="" method="post">

        用户:<input type="text" name="username"><br> <br>
        密码:<input type="password" name="password"><br> <br>
        性别:<label><input type="radio" name="gender" value="1">男</label>
        <label><input type="radio" name="gender" value="2">女</label><br> <br>
        爱好:<label><input type="checkbox" name="hobby" value="java">java</label>
        爱好:<label><input type="checkbox" name="hobby" value="html">HTML</label>
        爱好:<label><input type="checkbox" name="hobby" value="c">c语言</label><br> <br>
        图片:<input type="file" name="image"> <br> <br>
        生日:<input type="date" name="birthday"> <br> <br>
        时间:<input type="time" name="time"> <br> <br>
        日期时间:<input type="datetime-local" name="datetime"> <br> <br>
        邮箱:<input type="email" name="email"> <br> <br>
        年龄:<input type="number" name="age"> <br> <br>
        学历: <select name="degree" id="">
            <option value="">----------请选择---------</option>
            <option value="1">大专</option>
            <option value="2">本科</option>
            <option value="3">硕士</option>
            <option value="4">博士</option>

        </select><br> <br>
        描述:<textarea name="description" cols="30" rows="10"></textarea> <br> <br>
        <input type="hidden" name="id" value="1">

        <input type="button" value="按钮">
        <input type="reset" value="重置">
        <input type="submit" value="提交">



    </form>
</body>

</html>

action=" " 指定后端url地址

method="post" 请求方式 有两种 method="get"

表单标签输入方式type属性后面地双引号里面的值决定

相关推荐
神奇的程序员4 小时前
我的软件冲进苹果商店下载榜前 50 了
前端
阳光是sunny4 小时前
别再被 worktree 绕晕了!AI 编程时代你必须掌握的 Git 隔离神器
前端·人工智能·后端
万少6 小时前
万少的博客 - 技术分享与解决方案
前端·javascript·后端
尘世中一位迷途小书童8 小时前
用 Cesium 撸了一个森林火情监控大屏,弧线、粒子、发光效果都齐了
前端·javascript
IT_陈寒9 小时前
垃圾回收器选错了,我的Java服务内存炸了
前端·人工智能·后端
月光下的丝瓜9 小时前
Flutter 国内安装指南
前端·flutter
先吃饱再说9 小时前
JavaScript中`this` 的“千层套路”:从默认绑定到箭头函数的五种指向
javascript
玄星啊10 小时前
AI 编程的第 30 天,我怀念古法 Coding 了
前端·ai编程
Jolyne_10 小时前
Angular基础速通
前端·angular.js
foxire10 小时前
基于nodejs实现服务端内核引擎
javascript