1.表单
表单的作用:
在网页上将用户输入的数据提交给服务器
表单的语法：
<form action="表单提交的服务器地址" method="提交方法">
在语法中：
form
：定义一个表单，action是规定处理表单数据的目标地址，method是规定表单的提交方式，取值为get（公开）和post（隐藏），默认使用get , 通常使用post。
表单元素的基本语法：
<input name="元素名称" type="类型" value=“初始值”size=“显示宽度”maxlength=“字符长度”checked=“是否选中”/>
在语法中：
type
：
指定表单元素的类型，可用的选项有text（文本框），password（密码框），radio（单选按钮），checkbox（复选框），submit（提交按钮），reset（重置按钮），button（普通按钮），hidden（隐藏域），image（图片按钮），file（文件选择框），默认为text。
下拉列表框的语法：
<select name=“指定列表名称”size=“行数”>
<option value="可选项的值" selected=“selected”>.........</option>
<option value="可选项的值">.........</option>
<option value="可选项的值">.........</option>
............................................
</select>
在语法中：
selected
：表示该选项默认被选中
size
：确定列表中同时可见的行数
多行文本域的语法：
<textarea name="news" cols="40" rows="6">初始文本框内容</textarea>
在语法中：
cols
：指定多行文本域每行可以输入多少个字符
rows
：指定多行文本域最少的行数(超过则自动添加行数)
<textarea>........</textarea>
：不能使用value属性来赋值
表单结构：
<
fieldset>
<legend align=“left”>表单结构标题</legend><br/>
姓名：<input name=”” type=”text”/><br/>
性别：<input name=”” type=”text”/><br/>
年龄：<input name=”” type=”text”/><br/>
</fieldset>
在语法中：
<fieldset>..........<fieldset>
：为表单添加一个表单结构，将表单元素容纳在一个方框中；
<legend>........</legend>
：为表单结构添加一个标题；
align
：是指定标题的对齐方式，取值为left（标题左对齐），right（标题又对齐） 。
关联表单元素：
<label for=“name”>姓名</label><input name=“”type=“text”/>
在语法中：
<label for=“name”>姓名</label>：
是将姓名跟表单关联起来；
for
：是建立某个表单控件与表单的关联。
注意事项
1. 表单元素提交给服务器的前提是
必须要设置name属性
2.表单元素提交数据给服务器,提交的是表单元素的value属性.但是radio单选框,
checkbox复选框默认没有value值,
2 . CSS基本语法
<div>标签：
可以用于定义
HTML文档中的分区或节，即可以把HTML文档分割为独立的，不同的部分。
选择器：
表示被修饰的对象，如页面中被修饰的段落标签
<p>，列表标签<li>等；
属性：
希望改变的样式，如颜色（），字体大小（）等，属性和属性值用冒号
“：”隔开。
2.1.编写CSS的三种方式
1.内部方式
特点：
样式要放在style>标签里面的
格式：
<style type="text/css">
a{color:red;}
</style>
优点：
有一定的复用性，在当前html页面内
缺点：
只能在当前页复用
2.行内方式
特点:
直接将CSS代码写在html标签里面,以属性的形式存在
格式 :
<a href="#" style="color: red;">新闻标题1</a>
优点：
方便书写，可读性好
缺点：
不能复用
3.外部方式
特点
:
CSS代码写在外部文件中,以style属性的方式存在,由link独有的标签进行导入
格式 :
<link type="text/css" rel="stylesheet" href="css/1.css"/>
type : 引入资源的类型
rel : relation缩写，用于描述当前引入资源文件与html的关系---样式表
href : 引入文件的位置
优点：
极大的复用性，不同html都可以引用
缺点：
会造成多次访问服务器加载资源文件
2.2.CSS选择器
2.2.1基本选择器
1.标签选择器 :
根据标签名选择要操作的html元素
标签选择器的语法：
标签名
{
属性：属性值；
...............
}
2.ID选择器 :
html元素都有一个id属性,这个id属性用于标识html 元素唯一,所以id选择器就是操作唯一的html元素
ID选择器的语法：
#ID名称{
属性：属性值；
...............
}
在语法中：
ID选择器：
定义
ID选择器时有个“#”号，但设置HTML标签的ID属性时不需要
。
应用
ID选择器时，首先使用ID属性标记被修饰的页面元素。例如，设置某个<div>标签的id，<div id=“ID名称”>，然后定义相对的ID选择器样式就可以 了。
3.类选择器 :
是给html元素分类,分类之后再控制样式
类选择器的语法：
.类名{
属性：属性值；
...............
}
在语法中：
类选择器：
类选择器的类名可以任意选择，应用样式时使用标签的
class属性引用类样式，即：标签<名 class=“类名”>标签内容</标签名>
基本选择器的优先级 :
ID选择器 > 类选择器 > 标签选择器
2.2.2复合选择器
将基本选择进行组合之后就是符合选择器
1,并集选择器 (
符合其中一个选择器条件即可
)
格式 :
选择器名称1, 选择器名称2…{
样式属性1：样式属性值1；
样式属性2：样式属性值2；
……
}
在语法中：
多个选择器之间用英文半角输入法下的
“
，
”连接。
在并集选择器中，使用逗号连接的选择器，可以是基本选择器，也可以是复合选择器。
2.交集选择器(
符合所有选择器条件
)
格式 :
选择器名称 选择器名称{
样式属性1：样式属性值1；
样式属性2：样式属性值2；
……
}
在语法中：
<p>标签内嵌套<span>标签，<span>标签是<p>标签的后代，两者之间用空格隔开。
3.层级选择器(
操作指定层级结构的html元素样式
)
格式
选择器名称 选择器名称……{
样式属性1：样式属性值1；
样式属性2：样式属性值2；
……
}
4.属性选择器(
根据html元素属性设置样式
)
格式
选择器名称[属性名=“属性值”]{
样式属性1：样式属性值1；
样式属性2：样式属性值2；
……
}
优先级 :
就近原则，由于复合选择器是由基本选择器组合在一起，所以
优先级与基本选择器保持一致
2.3.3伪类选择器
操作html元素在不同状态下的样式
特点
任何html元素都有如下状态
未访问过状态
已访问过状态
鼠标悬浮状态
鼠标按下状态
格式
选择器名称:状态行为{
样式属性1：样式属性值1；
样式属性2：样式属性值2；
……
}
状态行为：
a:link {color: #FF0000} /* 未访问的链接 */
a:visited {color: #00FF00} /* 已访问的链接 */
a:hover {color: #FF00FF} /* 鼠标移动到链接上 */
a:active {color: #0000FF} /* 选定的链接 */
3 . CSS属性
3.1文本属性：
color：
设置文本颜色
line-height：
设置行高（间距）
text-align：
设置对齐方式，取值为
left，right，center
letter-spacing：
设置字符间距
text-decoration：
设置文本修饰，取值为
underline，none，overline，line-through，blink，inherit
white-space：
规定如何处理空白，如规定是否换行的常用等，常用取值为
nowrap（不换行）
3.2字体属性：
font：
在一个声明中设置字体所有的样式属性
font-family：
定义字体类型
font-size：
定义字体大小
font-weight：
定义字体的粗细
font-style：
设置字体风格（倾斜）
注意：
当同时需要设置英文字体和中文字体时，要将英文字体设置在中文字体之前，例如：
P{
font-family:Verdana,“宋体”；
}
3.3背景属性：
background：
简写属性，作用是将背景的多个分量属性设置在一个声明中
background-color：
设置元素的背景颜色
background-image：
把图像设置为背景
background-repeat：
设置背景的平铺方式
background-position：
设置背景出现的初始位置
3.4列表属性：
list-style：
简写属性，把所有用于列表的属性设置于一个声明中
list-style-image：
将图像设置为列表项标志
list-style-position：
设置列表中列表项标志的位置
list-style-type：
设置列表项标志的类型
4 . 盒子模型
CSS中盒子模型包括外边距（
margin
），边框（
border
）和内边距（
padding
）等属性。
4.1外边距
margin-top：
上外边距
margin-right：
右外边距
margin-bottom：
下外边距
margin-left：
左外边距
margin：
外边距缩写形式
4.2边框
border-top：
上边框
border-right：
右边框
border-bottom：
下边框
border-left：
左边框
border：
边框默认属性
border-color：
边框颜色
border-width：
边框宽度
border-style：
边框样式，取值为
none
（默认值，无边框），
solid
（实线），
dashed
（虚线）
4.3内边距
padding-top：
内容与上边框之间的距离
padding-right：
内容与右边框之间的距离
padding-bottom：
内容与下边框之间的距离
padding-left：
内容与左边框之间的距离
padding：
内边距默认属性
5 . 浮动（
float）
语法：
float：值；
在语法中：
left：
左浮动
right：
右浮动
none：
不浮动（默认值）
语法：
clear：值；
在语法中：
left：
左侧不允许有浮动
right：
右侧不允许有浮动
both：
两侧均不允许浮动
none：
允许浮动元素在两侧出现（默认值）
6 . 定位
CSS的
定位属性（
position）
主要包括
绝对定位（
absolute）
和
相对定位（
relative）
。绝对定位的元素与文档无关，不占据页面空间，他可以覆盖页面上的其他元素；相对定位与绝对定位不同，相对定位的元素无论是否进行移动，元素都会占据页面空间
绝对定位：
position：absolute；
设置绝对定位的堆叠次序：
z-index：2；
相对定位：
position：relative；
7 . 其他属性
7.1控制元素显示方式（
display）
控制元素显示方式的语法
display：值；
display的值：
block：
将元素显示为块级元素，该元素前后会带有换行符
inline：
元素被显示为内联元素，该元素前后没有换行符（默认值）
None：
该元素不会被显示
7.2处理盒子中内容的溢出（
overflow）
overflow的语法
Overflow：值；
overflow的值：
visible：
内容不会被修剪，呈现在盒子之外（默认值）
hidden：
内容会被修剪，并且其余内容是不可见的
scroll：
内容会被修剪，但是浏览器会显示滚动条以便查看其余内容
auto：
如果内容会被修剪，则浏览器会显示滚动条以便查看其余内容
7.3设置光标的形状（
cousor）
cousor的语法
cousor：值；
cousor的值：
pointer：
光标显示为
“手形”
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
