css属性cssproperties.docx

1、css属性csspropertiescss 属性( css properties )CSS properties DaquanFont properties: (font)Size font-size: X-LARGE; (large) XX-Small; (minimal) generalChinese can not be used, as long as the value can be, units: PX, PDStyle font-style: oblique; (partial italic) Italic; (italic) normal; (normal)Line heigh

2、t line-height: normal; (normal) units: PX, PD, EMThe thickness of font-weight: (BOLD) bold; lighter; normal; (Figure) (normal)Variant font-variant: small-caps; (small capitalization) normal; (normal)Case text-transform: capitalize; (initial uppercase) uppercase; (uppercase) lowercase; (lower case) n

3、one; (no)Modify text-decoration: underline; (underline) overline;(line up) line-through; (delete line) blink; (blinking)Commonly used fonts: (font-family)Courier, New, Courier, monospace, Times, New, Roman, Times, serif, Arial, Helvetica, sans-serif, VerdanaFont projection effect: filter:dropshadow

4、(color=#FFFFFF, offx=1, offy=1, positive=1);Background properties: (background)Color background-color: #FFFFFF;Picture background-image:, URL ();Repeat background-repeat: no-repeat;Scroll background-attachment: fixed; (fixed) scroll;Position background-position: left (horizontal) top(vertical);Short

5、hand method, background:#000, URL (.) repeat, fixed, left, top;Block properties: (Block)Word spacing letter-spacing: normal; numeric valueYes, Liu text-align: justify; (align at the end) left; (left aligned) right; (right aligned) center; (centered)Indent the text-indent: value px;(scroll)bottom;Ver

6、tically aligned vertical-align: baseline; (baseline) sub; (subscript) super; (subscript) top; text-top; middle; text-bottom;Word spacing word-spacing:, normal; numerical valueSpace white-space: pre; (reserved) nowrap; (no line feed)Display:block (block); inline; list-item; (embedded) (list) run-in (

7、additional); compact (compact); marker; table; inline-table (marker); table-raw-group; table-header-group; table-footer-group; table-raw; table-column-group; table-column; table-cell; table-caption; (table title)Box properties: (Box)order:solid;inset;Width:; height:; float:; clear:both; padding:; ma

8、rgin:; right, left, leftBorder properties: (Border)Border-style: dotted; (dot line) dashed; (dotted line) double; (double line) groove; (slot line) ridge; (ridged) (SAG) outset;Border-width:; border widthBorder-color:#;Shorthand method border:width, style, color;List properties: (List-style)Type lis

9、t-style-type: disc; (DOT) circle; (circle) square;(Fang Kuai) decimal; (number) lower-roman; (Ronaldinho number) upper-roman; lower-alpha; upper-alpha;Location list-style-position: outside; (external) inside;Image list-style-image:, URL (.);Location attributes: (Position)Position: absolute; relative

10、; static;Visibility: inherit; visible; hidden;Overflow: visible; hidden; scroll; auto;Clip:, Rect (12px, auto, 12px, auto) (cut)CSS property code GuinnessOne CSS text property:Color: #999999; / * * / text colorFont-family: Arial, sans-serif; / * * / text fontFont-size: 9pt; / * * / text sizeFont-sty

11、le:itelic; / * * / italic textFont-variant:small-caps; / * * / small fontLETTER-SPACING: 1pt; / * * / distance between wordsLine-height: 200%; / * * / set the rowFont-weight:bold; / * * / bold textVertical-align:sub; / * * / word.Vertical-align:super; / * * / word. Text-decoration:line-through; / *

12、* / strikethroughText-decoration:overline; / * and * / top lineText-decoration:underline; / * * / underline Text-decoration:none; / * * / delete link underline Text-transform: capitalize; / * * / first character uppercase文本转换：大写； / * * / 英文大写文本转换：小写； / * * / 英文小写文本对齐：右； / * * / 文字右对齐文本对齐：左； / * * /

13、文字左对齐文本对齐：中心；文字居中对齐 / * * /文本对齐：对齐； / * * / 文字分散对齐垂直对齐属性垂直对齐：顶； / * * /垂直向上对齐垂直对齐：底部； / * * /垂直向下对齐垂直对齐：中部； / * * /垂直居中对齐垂直对齐：文字 / * * /文字垂直向上对齐顶；垂直对齐：文字 / * * /文字垂直向下对齐底；布局：垂直流 / * * / 文字竖着排列表意二、 cssi框空白填料： 10px；/ * * / 上边框留空白填充右： 10px；/ * * / 右边框留空白座垫： 10px；/ * * / 下边框留空白填充左： 10px；/* 左边框留空白三、 CSS符

14、号属性：目录样式类型：无； / * * / 不编号 目录样式类型：十进制； / * * / 阿拉伯数字 目录样式类型：低 / * * / 小写罗马数字罗马； 目录样式类型：大写罗马数字； / * * / 大写罗马数字目录样式类型：低a； / * * / 小写英文字母目录样式类型：上a； / * * / 大写英文字母 目录样式类型：盘； / * * / 实心圆形符号 目录样式类型：圆； / * * / 空心圆形符号 目录样式类型：广场； / * * / 实心方形符号 列表样式图像：URL（/点。GIF）; / * * / 图片式符号 目录样式位置：外凸排； /* */ 列表样式的位置：在缩进；

15、/ * * /四、CSS背景样式：背景颜色： # f5e2ec ； / * * / 背景颜色背景：透明； / * * / 透视背景背景图像：URL（/图像/ BG .gif ）； / * * / 背景图片背景附件：固定； / * * / 浮水印固定背景 背景重复：重复； / * * / 重复排列 -网页默认背景重复：不重复； / * * / 不重复排列背景重复： repeat-x ；/ * * / 轴重复排列在 X 背景：纵向重复；重复在 丫轴重复排列* / / * 指定背景位置背景位置：90% 90% /*背景图片X与丫轴的位置*/背景位置：顶； / * * /向上对齐背景位置：按钮； /

16、* * /向下对齐背景位置：左； / * * /向左对齐背景位置：右； / * * /向右对齐背景：中心位置； / * * / 居中对齐五、CSS连接属性：所有超链接 / * * /一：链接 / * * / 超链接文字格式 答：浏览过的链接文字格式参观 / * * / 一：主动 / * * / 按下链接的格式 答：鼠标转到链接悬停 / * * / 鼠标光标样式： 链接手指鼠标手 十字体十字光标： 箭头朝下光标： s-resize 十字箭头：移动光标 箭头朝右：移动光标 加一问号光标：帮助 箭头朝左光标： w-resize 箭头朝上光标： n-resize 箭头朝右上光标：NE调整 箭头朝左上光

17、标：NW调整 文字我型光标：文本 箭头斜右下光标：SE调整 箭头斜左下光标：软件大小 漏斗光标：等待 光标图案（ IE6） P cursor: url （“光标文件名 .cur ”），文本； 六、csS匡线一览表：边境上： 1px solid # 6699cc ；/ * * / 上框线 底部边框： 1px solid # 6699cc ；/ * * / 下框线左边界： 1px solid # 6699cc ；/ * * / 左框线边境： 1px solid # 6699cc ；/ * * / 右框线以上是建议书写方式，但也可以使用常规的方式如下： 边境上的颜色： # 369 / * * / 颜

18、色设置上框线顶 边框顶部宽度： 1px / * * / 宽度设置上框线顶 边境上的风格：固体 / * 设置上框线顶样式 */ 其他框线样式 实线框固 / * * / 虚线框点缀 / * * / 双线框双 / * * / groove 立体内凸框 / * * /ridge 立体浮雕框 / * * /inset 凹框 / * * /outset 凸框 / * * /七、 css表单运用：文字方块按钮复选框选择钮多行文字方块下拉式菜单 选项 1选项 2八、 css 边界样式 ：上边界右边界值下边界值左边界值margin top： 10px; / * * /margin - right： 10px;

19、/ * * / margin - bottom： 10px; / * * / margin - left： 10px; / * * / css 属性 ： 字体样式 (font style)序号 中文说明 标记语法1字体样式 font: font style font variant font weight font - size font - family2字体类型 font - family: 字体 1 , 字体 2 , 字体 3 ,.3字体大小 font size: 数值 | inherit | medium| large | larger | x - large | xx - large

20、 | small | smaller | x small | xx - small4字体风格 font style: inherit | italic | normal | oblique5字体粗细 font - weight: 100 - 900 | bold | bolder | lighter | normal;6 字体颜色 color: 数值 ;7阴影颜色 text shadow: 16 位色值 8字体行高 line height: 数值 | inherit | normal;9字 间 距 letter - spacing: 数值 | inherit | normal10单词间距 wo

21、rd spacing: 数值 | inherit | normal11字体变形 font variant: inherit | normal | small - cps12英文转换 text transform: inherit | none | capitalize | uppercase | lowercase13字体变形 font - size adjust: inherit | none14字体 font stretch: condensed | expanded | extra condensed | extra expanded | inherit | narrower | nor

22、mal | 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 | wink3段首空格 text indent: 数值 | inherit4水平对齐 text - align: left | right | ce

23、nter | justify5垂直对齐 vertical - align: inherit | top | bottom | text top | text - bottom | baseline | middle | pdo | super6书写方式 writing mode: lr - tb | tb rl背景样式序号 中文说明 标记语法1背景颜色 background color: 数值 2背景图片 background image: url (url) | none3背景重复 background repeat: inherit | no | repeat repeat repeat

24、repeat | | - x - y4背景固定 background attachment: fixed | scroll5背景定位 background position: 数值 | | top bottom left right center | | |6背影样式 background: 背景颜色 | 背景图象 | 背景重复 | 背 景附件 | 背景位置 框架样式 (box style)序号 中文说明 标记语法1边界留白 margin: margin top margin margin bottom margin - right - - left2补 白 padding: padding

25、top padding - right padding - bottom - left padding3边框宽度 the border width, border top border width - right- width border bottom width border left width宽度值 : thin | medium | thick | 数值4 边框颜色 border color: 数值 数值 数值 数值 数值 : 分别代 表 top 、right 、bottom 、left 颜色值5 边框风格 border style: none | hidden | inherit

26、| dashed |solid | double | inset | outset | ridge | groove6边 框 border: the border width border style color上 边 框 border top: border top width border style color右 边 框 border right border: - right - width border style color下 边 框 border bottom: border bottom width border style color左 边 框 border left: th

27、e border left width border style color7 宽 度 width: 长度 | 百分比 | auto8 高 度 height: 数值 | auto9漂浮浮动：左 |右|没有10清除清楚：没有 |左右| | 两分类列表序号中文说明标记语法1控制显示 显示：无 | 块| 内联|列表项 2 控制空白 白空间：正常 | 预 | nowarp 3符号列表列表样式类型：盘 |圈|平方|小数|下罗马|大写罗马数字 |低a |上a |没有4 图形列表 列表样式图像： URL 5位置列表列表样式的位置：在 | 外6目录列表列表样式：目录样式类型 | 目录样式位置 | URL 7 鼠标形状 光标：手 | 十字 | 文本 | 等 | 移动 | 帮助 | e-resize | NW 调 整| w-resize | s-resize | SE 调整 | SW 调整