css属性设置

一、css文字属性

color:#999999; / 文字颜色 /
font-family:宋体，sans-serif;/ 文字宋体 /
font-size:9pt;/ 文字大小 /
font-style:itelic;/ 文字斜体 /
font-variant:small-caos;/ 小字体 /
letter-spacing:1pt;/ 字间距离 /
line-height: 200%;/ 设置行高 /
font-weight: bold;/ 文字粗体 /
vertical-align: sub;/ 下标字 /
vertical-align: super;/ 上标字 /
text-decoration: line-through;/ 加删除线 /
text-decoration: overline;/ 加顶线 /
text-decoration: underline;/ 加下划线 /
text-decoration: none;/ 删除链接下划线 /
text-transform: capitalize;/ 首字母大写 /
text-transform: uppercase;/ 英文大写 /
text-transform: lowercase;/ 英文小写 /
text-align: right;/ 文字右对齐 /
text-align: left;/ 文字左对齐 /
text-align: center;/ 文字居中对齐 /
text-align: justify;/ 文字分散对齐 /
vertical-align: top;/ 垂直向上对齐 /
vertical-align: bottom;/ 垂直向下对齐 /
vertical-align: middle;/ 垂直居中对齐 /
vertical-align: text-top;/ 文字垂直向上对齐 /
vertical-align: text-bottom;/ 文字垂直向下对齐 /

二、css边框空白

padding-top: 10rpx;/ 上边框留白 /
padding-right: 10rpx;/ 右边框留白 /
padding-bottom: 10rpx;/ 下边框留白 /
padding-left: 10rpx;/ 左边框留白 /

三、css符号属性

list-style-type: none;/ 不编号 /
list-style-type: decimal;/ 阿拉伯数字 /
list-style-type: lower-roman;/ 小阿拉伯数字 /
list-style-type: upper-roman;/ 大阿拉伯数字 /
list-style-type: lower-alpha;/ 小写英文字母 /
list-style-type: upper-alpha;/ 大写英文字母 /
list-style-type: disc;/ 实心圆形符号 /
list-style-type: circle;/ 空心圆形符号 /
list-style-type: square;/ 实心方形符号 /
list-style-image: url(/dot.gif);/ 图片式符号 /
list-style-position: outside;/ 凸排 /
list-style-position: inside;/ 缩进 /

四、css背景样式

background-color: #f5e2ec;/ 背景颜色 /
background: transparent;/ 透视背景 /
background-image: url();/ 背景图片 /
background-attachment: fixed;/ 浮水印固定背景 /
background-repeat: no-repeat;/ 不重复排列 /
background-repeat: repeat-x;/ 在x轴上重复排列 /
background-repeat: repeat-y;/ 在y轴上重复排列 /

指定背景位置

background-position: 90% 90%;/ 背景图片在x与y轴的位置 /
background-position: top;/ 向上对齐 /
background-position: bottom;/ 向下对齐 /
background-position: left;/ 向左对齐 /
background-position: right;/ 向右对齐 /
background-position: center;/ 居中对齐 /

五、css链接属性

a/ 所有超链接 /
a:link/ 超链接文字格式 /
a:visited/ 浏览过的链接文字格式 /
v:active/ 按下链接的格式 /
a:hover/ 鼠标转到链接 /

鼠标光标样式

链接手指 CURSOR:hand
十字体 cursor:crosshair
箭头朝下 cursor:s-resize
十字箭头 cursor:move
箭头朝左 cursor:w-resize
加一问号 cursor:help
箭头朝上 cursor:n-resize
箭头朝右上 cursor:ne-resize
箭头朝左上 cursor:nw-resize
文字I型 cursor:text
箭头斜右下 cursor:se-resize
箭头斜左下 cursor:sw-resize
漏斗 cursor:wait
光标图案(E6) p {cursor:url("光标文件名.cur"),text}

六、css框线一览表

border-top: 1px solid #69c; / 上框线 /
border-bottom: 1px solid #69c;/ 下框线 /
border-left: 1px solid #69c;/ 左框线 /
border-right: 1px solid #69c; / 右框线 /
以上是建议书写方式，但也可以使用常规的方式，如下：
border-top-color: #369;/ 设置上框线top颜色 /
border-top-width: 1rpx;/ 设置上框线top宽度 /
border-top-style: solid;/ 设置上框线top样式 /

其他框线样式

solid/ 实线框 /
dotted/ 虚线框 /
double/ 双线框 /
groove/ 立体内凸框 /
ridge/ 立体浮雕框 /
inset/ 凹框 /
outset/ 凸框 /

七、css表单运用

文字方块
按钮
复选框
选择钮
多行文字方块
下拉式菜单选项1选项2

八、css边界样式

margin-top: 10rpx;/ 上边界 /
margin-right: 10rpx;/ 右边界 /
margin-bottom: 10rpx;/ 下边界 /
margin-left: 10rpx;/ 左边界 /