CSS样式属性大全
简写方法 background:#000 url(..) repeat fixed left top; 区块属性： (Block)
显示display:block;(块) inline;(内嵌) list-item;(列表项) run-in;(追加部分) compact;(紧凑) marker;(标记) table; inline-table; table-raw-group; table-header-group; table-footer-group; table-raw; table-column-group; table-column; table-cell; table-caption;(表格标题) 方框属性： (Box)
width:; height:; float:; clear:both; margin:; padding:; 顺序：上右下左 定位属性： (Position)
Position: absolute; relative; static; visibility: inherit; visible; hidden; overflow: visible; hidden; scroll; auto; clip: rect(12px,auto,12px,auto) (裁切)
七、CSS表单运用： 文字方块 按钮 复选框 选择钮 多行文字方块 下拉式菜单 选项1选项2 颜色
1 前景色 {color:#数值|名称|rgb值;} 2 背景色 {background-color}
3 透明度 {opacity|rgba(N,N,N,0.0~1.0)} 4 hsl(x%,y%,z%)|hsla(x%,y%,z%,0.0~1.0)
字体样式(Font Style) 序号 中文说明 标记语法
1 字体样式 {font:font-style font-variant font-weight font-size font-family} 2 字体类型 {font-family:\字体1\字体2\字体3\
常用字体：\, monospace, \Helvetica, sans-serif, Verdana
3 字体大小 {font-size:数值（单位px、pd）|inherit| medium| large| larger| x-large| xx-large（特大）| small| smaller| x-small| xx-smal（极小）;}
4 字体风格 {font-style:inherit|italic（斜体）|normal（正常）|oblique（偏斜体）;} 5 字体粗细 {font-weight:100-900|bold（粗体）|bolder|lighter（细体）|normal（正常）;} 6 字体颜色 {color:数值;}
7 阴影颜色 {text-shadow:npx npx npx 16位色值;}
8 字体行高 {line-height:数值（px、pd、em）|inherit|normal;} 9 字母间距 {letter-spacing:数值|inherit|normal;单位em} 10 单词间距{word-spacing:数值|inherit|normal;单位em}
11 字体变体{font-variant:inherit|normal|small-cps(小型大写字母) ;}
12 英文转换（大小写） {text-transform:inherit|none（无）|capitalize（首字母大写）|uppercase（大写）|lowercase（小写）;}
13 字体变形{font-size-adjust:inherit|none;}
14文本修饰 {text-decoration:inherit|none（删除链接下划线）|underline（下划线）|overline（上划线）|line-through（删除线）|blink（闪烁）;} 15 字体
{font-stretch:condensed|expanded|extra-condensed|extra-expanded|inherit|narrower|normal| semi-condensed|semi-expanded|ultra-condensed|ultra-expanded|wider}
文本样式(Text Style) 序号 中文说明 标记语法
1 行 间 距 {line-height:数值|inherit|normal;}
2 文本修饰 {text-decoration:inherit|none（删除链接下划线）|underline（下划线）|overline（上划线）|line-through（删除线）|blink（闪烁）;} 3 段首空格 {text-indent:数值|inherit}
4 水平对齐 {text-align:left|right|center|justify（分散对齐）}
5 垂直对齐 {vertical-align:inherit|top|bottom|text-top（文字垂直向上对齐）|text-bottom（文字垂直向下对齐）|baseline|middle|sub（下标字）|super（上标字）} 6 书写方式 {writing-mode:lr-tb|tb-rl}
7 首字母 p.intro:first-letter{font-size=200%;} 8 首行文本p. p.intro:first-line{}
9 超链接 a:link（超链接文字格式）|a:visited（浏览过的链接文字格式）|a:active （按下链接的格式）|a:hover (鼠标转到链接)
背景样式
序号 中文说明 标记语法
1 背景颜色 {background-color:#数值;}
2 背景图片 {background-image: url(URL)|none;}
3 背景重复 {background-repeat:inherit|no-repeat|repeat（横向纵向都平铺）|repeat-x（横向平铺）|repeat-y（纵向平铺）}
4 背景固定 {background-attachment:fixed(浮水印固定背景)|scroll（图像随页面滚动）} 5 背景定位 {background-position:数值 数值（离左，离顶）|x% y%（水平，垂直）|top（上）|bottom（下）|left（左）|right（右）|center（中）（两个任意组合）;}
6 背影样式 {background:背景颜色|背景图象|背景重复|背景附件|背景位置|transparent（透明背景）;}
框架样式(Box Style) 序号 中文说明 标记语法
1 边界留白 {margin:margin-top=10px;（上边界） margin-right margin-bottom margin-left}
2 边框补白 {padding:padding-top:10px;(上边框补空白，下同) padding-right padding-bottom padding-left}
3 边框宽度 {border-width:border-top-width border-right-width border-bottom-width border-left-width}
宽度值： thin|medium|thick|数值
4 边框颜色 {border-color:数值 数值 数值 数值} 数值：分别代表top、right、bottom、left颜色值
5 边框风格 {border-style:none|hidden|inherit|dashed|solid（实线框）|double（双线框）|dotted（虚线框）|inset（凹框）|outset（凸框）|ridge（立体浮雕框）|groove（立体内凹框）} 6 边 框 {border:border-width border-style color}
上 边 框 {border-top:border-top-width:1px; border-top-style:soild; border-top-color:#6699cc;}
右 边 框 {border-right:border-right-width border-right-style border-right-color} 下 边 框 {border-bottom:border-bottom-width border-bottom-style border-bottom-color}
左 边 框 {border-left:border-left-width border-left-style border-left-color} 7 宽 度 {width:长度|百分比| auto} 8 高 度 {height:数值|auto} 9 漂 浮 {float:left|right|none} 10 清 除 {clear:none|left|right|both}
分类列表
序号 中文说明 标记语法
1 控制显示 {display:none|block|inline|list-item} 2 控制空白 {white-space:normal|pre|nowarp}
3 符号列表 {list-style-type:disc（实心圆形符号）|circle（空心圆形符号）|square（实心方形符号）|decimal（阿拉伯数字）|decimal-leading-zero（01）|lower-roman（小写罗马数字）|upper-roman（大写罗马数字）|lower-alpha（小写英文字母）|upper-alpha（大写英文字母）|none（不编号）;}
4 图形列表 {list-style-image:URL}
5 位置列表 {list-style-position:inside（缩进）|outside（凸排）} 6 目录列表 {list-style:目录样式类型|目录样式位置|url}
7 鼠标形状 {cursor:hand（链接手指）|crosshair（十字体）|text（文字I型）|wait（漏斗）|move|help（问号）|e-resize（→）|nw-resize（↖）|ne-resize（↗）|w-resize（←）|s-resize（↓）|se-resize（↘）|sw-resize（↙）;}
8光标图案(IE6) p {cursor:url(\光标文件名.cur\
表格属性 1 宽度 {width}
2 单元格边框与内容空隙 {padding} 3 表格标题内容转换 {text-transform} 4 对齐 {text-align}
5 表格行背景 {background-color}
6 高亮{:hover}
7 空单元格的边框{empty-cells:show|hidden|inherit（遵循外部表格，继承）;} 8 间隙{border-spacing:数值 数值;}
9 合并单元格{border-collapse:collapse|separate;}
定位（position）
1 普通流 {position:static;}
2 相对 {position:relative; top=10px; left=100px;}
3 绝对 {position:absolute; top=0px; left=10px; wideth=100px;} 4 固定 {position:fixed; top=0px; left=0px;} 5 重叠 {z-index:数值}
表单验证代码全集(JavaScript)
1:js 字符串长度限制、判断字符长度、js限制输入、限制不能输入、textarea 长度限制 2.:js判断汉字、判断是否汉字 、只能输入汉字 3:js判断是否输入英文、只能输入英文
4:js只能输入数字,判断数字、验证数字、检测数字、判断是否为数字、只能输入数字 5:只能输入英文字符和数字
6: js email验证 、js 判断email 、信箱/邮箱格式验证 7:js字符过滤,屏蔽关键字 8:js密码验证、判断密码
2.1: js 不为空、为空或不是对象 、判断为空、判断不为空 2.2:比较两个表单项的值是否相同 2.3:表单只能为数字和\2.4:表单项输入数值/长度限定
2.5:中文/英文/数字/邮件地址合法性判断 2.6:限定表单项不能输入的字符 2.7表单的自符控制
2.8:form文本域的通用校验函数
1. 长度限制