HTML，CSS在Visual Studio Code用法-优快云博客

HTML超文本链接

单元格<td>的属性：

bgcolor：设置单元格的背景颜色。

background：设置单元格的背景图片。

width、height：设置单元格的宽度和高度。

align：设定单元格内容的水平对齐方式，有三种：right（居右）、 left（居左）、center（居中）。

valign：设定单元格的垂直对齐属性，有三种：top（居上）、middle（居中）、bottom（居下）。 rowspan：单元格的跨行属性。（垂直方向上） colspan：单元格的跨列属性。（水平方向上）

简单举个例子：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
</head>
<body>
    <table border="1" width="400" height="130" cellpadding="10" cellspacing="0" align="center">
        <tr>
            <td>数学</td>
            <td>语文</td>
            <td>英语</td>
        </tr>
        <tr>
            <td>数学</td>
            <td>语文</td>
            <td>英语</td>
        </tr>
        <tr>
            <td>数学</td>
            <td>语文</td>
            <td>英语</td>
        </tr>
    </table>
</body>
</html>

这是一个简单的表格，里边的内容是

表单

基本语法： name基本语法： <form name=“表单名” >……</form>

action基本语法： <form action=“提交地址” >……</form>

提交方式基本语法： <form method=“信息的提交方式” >……</form><form name=“表单名” >……</form>

提交的方式分为get和post两种，get对字符的数量进行了限制，不能超过8192个字符，而post没有字符限制。

表单的标记，单选按钮<redio>，基本语法：<input type=“radio” name=“field_name” checked value=value>

多选/复选按钮：<checkbox>,基本语法：<input type=“checkbox” name=“field_name” checked value=value>

在表单中，下拉菜单也是可以设置的，基本的语法：<select name=“name” size=value multiple > <option value=“value” selected >选项</option> …… </select>

图像域image：src表示图片的路径，路径是通过你的图片而去修改的，基本语法：<input type=“image” name=“field_name” src=“image_url”>

举个例子：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <center>
        <h3>注册新用户</h3>
        <hr>
        <form action="success.html" method="get">
            姓名：<input type="text" name="username" maxlength="4" size="20" value="admin"><br>
            密码：<input type="password" name="password" value="123456" disabled><br>
            性别：<br>
            &nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="gender" value="1" checked>男<br>
            &nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="gender" value="0">女<br>
            爱好：<br>
            &nbsp;&nbsp;&nbsp;&nbsp;<input type="checkbox" name="hobby" value="唱歌">唱歌<br>
            &nbsp;&nbsp;&nbsp;&nbsp;<input type="checkbox" name="hobby" value="跳舞">跳舞<br>
            &nbsp;&nbsp;&nbsp;&nbsp;<input type="checkbox" name="hobby" value="旅游" checked>旅游<br>
            &nbsp;&nbsp;&nbsp;&nbsp;<input type="checkbox" name="hobby" value="书法" checked>书法<br>
            城市：<br>
            &nbsp;&nbsp;&nbsp;&nbsp<select name="city">
                <option>---请选择您所在的城市</option>
                <option value="beijing" selected>北京</option>
                <option value="shanghai">上海</option>
                <option value="guangzhou">广州</option>
                <option value="shenzhen">深圳</option>
            </select><br>
            上传照片：<input type="file" name="file"><br>
           <div class="form-group">
    请留言：<br>
    &nbsp;&nbsp;&nbsp;&nbsp;<textarea name="content" rows="10" cols="80" id="message">
留言……
    </textarea><br>
    <input type="hidden" name="id" value="123"><br>
</div>

<div class="form-group">
    上传照片：<br>
    &nbsp;&nbsp;&nbsp;&nbsp;<input type="file" id="photo" name="photo"><br>
</div>

<div class="form-group">
    <input type="submit" value="提交">
    <input type="reset" value="重置">
    <input type="button" value="保存" onclick="javascript:window.alert('确定要保存吗？')">
    <input type="" src="" alt="提交图片">
</div>
        </form>
        <!--
        readonly:这是一个单属性，表示这个输入框是不可编辑的，但是输入框中的值会被提交到服务器中
        disabled:这是一个单属性，表示这个输入框是失效的，不能编辑，失效的输入框中的值不会被提交到服务器端。
        -->
    </center>
</body>
</html>

运行结果：