NO.54 表单、CSS基础

1.表单元素：用来声明表单的范围，只有此范围内填写的数据才能提交给服务器。

action：用来声明表单提交的目标。

例：

2.表单控件：用来让用户输入数据。

2.1 input元素

文本框

value：设置默认值

maxlength：设置最大长度

例：账号:

密码框

value：设置默认值

maxlength：设置最大长度

例：密码:

单选框

name：组名，同一组单选才能彼此互斥。

checked：设置默认选中。

例：性别:男女

多选框

checked：设置默认选中。

例：美食旅游

隐藏框

例：

文件框

例：

提交、重置、普通按钮

例：

2.2 其他元素

label：用来管理表单中的文字，它可以将文字与控件绑定，从而增加控件的点击范围，提高易用性。

id是元素的唯一标识，任何元素都可以有id。

例：我已阅读并自愿遵守此协议

下拉选

selected：设置默认选中。

例：城市:

请选择

成都

深圳

文本域

cols：设置宽度。

rows：设置高度。

例：简介:

---

CSS的三种用法

1.内联样式：在元素的style属性内书写样式。

2.内部样式：在style标签内书写样式。

3.外部样式：在单独的css文件内书写样式。

CSS的规则特性

1）继承性：子元素可以继承父元素的样式（字体，颜色）。

2）层叠性：给一个元素增加不同的声明，效果会叠加。

3）优先级：给一个元素增加相同的声明，效果以后者为准。也叫就近原则（哪个样式离元素近就哪个生效）。

选择器

1）元素选择器：选择body、p、h1等等。

2）类选择器：选择class=某值的所有元素。

3）ID选择器：选择id=某值的唯一元素。

4）选择器组：可以选中一组选择器所对应目标的并集。

5）派生选择器：选择某元素的子孙----#p1 b    选择某元素的儿子-----#p2>b

6）伪类选择器：选择某状态之下的元素。

选择未访问过的超链接----a:link

选择已访问过的超链接----a:visited

选择激活态(正在点)的按钮----#b1:active

选择有焦点的文本框----#t1:focus

选择悬停态的图片----img:hover

---

边框问题

效果：

box模型

效果：