<!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>
块标签,行标签,表格,表单,下拉,多选
最新推荐文章于 2021-07-26 10:47:15 发布