meta标签
1.设置字符集<meta charset="UTF-8">
作用: 防止页面乱码(编码、解码)
2.设置网页关键字<meta name="keywords" content="关键字,用逗号隔开">
作用: 给搜索引擎
3.设置网页描述 <meta name="description" content="网页描述">
搜索时显示的值
4.设置网页重定向 <meta http-equiv="refresh" content="2,url=02link.html">
2s后跳转设置的网页
link
- 用来引用外部样式表
<link rel="stylesheet" href="">
- 设置网页图标
<link rel="icon" href="favicon.ico">
注意:
1.网页图标最好是icon格式 2.网页图标最好放到网站根目录下
表格
- 表格
作用: 1.用来表示数据、2.使用表格布局(div+css)
-组成
行tr 列(单元格)td 范围table- 属性1
border : 0 默认没有边框
width: 设置宽度
height: 设置高度
cellspacing=2 默认值为2,设置td与td之间的距离
cellpadding=0 设置内容与边框之间的距离
注意: cellpadding 值可以影响表格大小
- 属性2
align: left center right 设置对齐方式 注意:
- 如果给table设置align,只能改变table的位置,不能改变table中内容的位置
- 要改变内容对齐方式,给tr或td设置align
bgcolor: 设置背景颜色
- 组成
表头标签
<th></th>
用法和td一样 ` <tr> <th></th> <th></th></tr>`
标题标签
<caption>个人信息表</caption>
- 表格结构 `<table> <thead> <tr> <th></th> </tr> </thead> <tbody> <tr> <td></td> </tr> </tbody> <tfoot> <tr> <td></td> </tr> </tfoot>
</table>`
- 合并单元格
colspan 横向合并
rowspan 纵向合并
注意: 被合并的要去掉 ` <body> <tr> <td colspan="4"></td> </tr> <tr> <td rowspan="2"></td> </tr> </body>`
8/29/2016 2:19:47 PM
8/29/2016 3:40:49 PM
form
- 作用 用户收集用户信息
- 组成 表单域、表单控件(重点)、提示信息
-
表单域
<form action=""></form>
action属性: 设置一个处理表单数据的应用程序 method属性 设置提交表单数据的方式,get post
- 表单提交方式
-
get 提交的表单数据会暴露在地址栏中,不安全 post 通过后台的方式进行数据提交安全。
-
表单控件
- 输入框
<input type="text">
size input控件在页面中显示的宽度
- name属性 设置表单控件的名称
- maxlength属性 设置空间中最多输入多个字符
- readonly=“readonly” 设置控制为只读
- disable=“disable” 当前控件未激活(只能看不可编辑)
- value 设置默认值
- 密码输入框
<input type="password">
- 单选控件
<input type="radio" name="gender">nan<input type="radio" name="gender">nv
注意:要实现单选效果,设置相同的name - 下拉列表
<select><option>aaa</option><option selected="selected">bbb</option></select>
注意:selected=”selected”默认选中 ———-
- 输入框
- 注意:
size指定下拉菜单的可见选项数 <select size="3"> .... </select>
- 下拉列表2 多选
<select multiple="multiple"><option>aaa</option><option>bbb</option></select>
- 下拉列表3 包含提示信息
<select><optgroup label="上海"><option>普陀</option><option>徐汇</option></optgroup></select>
- 多选
<input type="checkbox">逛街1<input type="checkbox" checked="checked">逛街2<input type="checkbox">逛街3
- 多行文本域
<textarea cols="30" rows="10"></textarea> cols="30"相当于宽度,rows="10"相当于列数
- 上传
<input type="file">
- 隐藏 页面中无法看到,但是后台程序可以获取到里面的值
<input type="hidden" value="123">
- 按钮
- 提交按钮 (提交表单)
<input type="submit">
- 普通按钮(要给js使用)
<input type="button" value="按钮" onclick="">
- 重置按钮(将表单恢复到默认值)
<input type="reset">
- 图片提交按钮(提交表单)
<input type="image" src="">
- 表单整体分组控件(补充控件)
- 包含的边框
<form action=""><fieldset> <legend>丰趣</legend></fieldset></form>