表单的作用: 收集用户信息
表单元素:
input:
type="text" 单行文本输入框
type="password" 密码框
type="submit" 提交按钮
type="reset" 清空按钮
type="button" 普通按钮
name="名字"
value="值"
method="提交方式"
get:
1: 在地址栏提交
2: 明文显示,不安全
3: 地址栏有长度限制,有可能造成数据丢失
4: 提交数据较短,提交速度快
5: 通常向数据库获取数据,不会改变数据库数据
post:
1: 不在地址栏提交
2: 不显示,安全
3: 没有长度限制
4: 提交的数据较长,提交的速度慢
5: 通常向数据库发送数据,会改变数据库数据
css: 层叠样式表,用来修饰页面变得更加好看
css语法规则:
选择器{
属性1:值1 值2 值3;
属性2:值;
}
样式表创建:
1: 内部样式
在head标签中添加
<style type="text/css">
选择器{
属性:值;
}
</style>
2: 外部样式
1: 创建一个独立的html文件,后缀为 .html
2: 创建一个独立的css文件,后缀为 .css
3: 关联
关联方式一(推荐使用)
在html页面中的head标签中添加
<link rel="stylesheet" type="text/css" href="css文件地址">
关联方式二(了解)
在style标签中的第一行添加
@import url("css文件地址");
link 和 @import 的区别:
1: 本质区别,link是标签;@import是css提供的一种写法
2: 加载顺序不同,link同时加载,@import后加载
3: 兼容性问题,link没有兼容问题,@import低版本ie不兼容
4: 能否被dom控制,link能被控制,@import不能被控制
3: 内联样式
<标签 style="属性:值;"></标签>
<标签 style="属性:值;" >
样式表权重对比:
内联样式 > 内部样式 / 外部样式
【注】内部样式和外部样式受到加载顺序的影响，后加载的覆盖先加载的，覆盖的是相同的属性
选择器:
类型选择器(标签选择器): div a ul li ol p span...
类选择器(class选择器):
<标签 class="name"></标签>
.name{
属性:值;
}
【注】
在同一个页面中可以多次出现相同的class值
在同一个class中,可以有多个值
具有重用性,通常用在css中
id选择器:
<标签 id="name"></标签>
#name{
属性:值;
}
【注】
在同一个页面中只有一个相同的id值
在同一个id中只有一个值
具有唯一性,通常不用在css中
通配符: *{}
通通匹配,匹配所有的元素
*{margin:0;padding:0;}
群组选择器:
选择器1,选择器2,选择器3{} 匹配1 2 3,同时匹配了3个元素
后代选择器(包含选择器):
选择器1 选择器2 选择器3{} 匹配1里面的2里面的3,最终匹配的是3
