CSS常用属性大全

合集下载

CSS——八大属性

CSS——⼋⼤属性⼀、颜⾊有三种表⽰颜⾊的⽅法：英⽂单词、⼆进制颜⾊代表码、rgb，⼆、字体font-size：15px；设置字体⼤⼩，常⽤像素指定字体⼤⼩，指定长度的字号，不会随着浏览器的变化⽽变化font-family：宋体；设置字体类型font-weight：lighter、bold、bolder，设置字体粗细，常⽤的三种效果选择font-style：oblique；设置字体倾斜font-variant:small-caps；将⼩写字母转成⼤写字母；color：设置字体颜⾊<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>exercise4</title><style>#color_en{color:blue}#color_bin{color:#F0F;}#color_rgb{color:rgb(255,0,255)}#color_pellucidity{color:rgba(255,0,255,0.2)}#ablout_font{background-color:rgba(0,255,255,0.2);}#font_size{background-color:rgba(0,255,255,0.2);font-size:15px;}#font_family{background-color:rgba(0,255,255,0.2);font-family:YouYuan;}#font_lighter{background-color:rgba(0,255,255,0.2);font-weight:lighter;}#font_bold{background-color:rgba(0,255,255,0.2);font-weight:bold;}#font_bolder{background-color:rgba(0,255,255,0.2);font-weight:bolder;}#font_style{background-color:rgba(0,255,255,0.2);font-style:oblique;}</style></head><body><p>练习属性property</p><p id="ablout_font">⼆、关于字体</p><p id="font_size">font-size设置字体⼤⼩，如：15px</p><p id="font_family">font-family设置字体类型如：YouYuan</p><p id="font_weight"><a id="font_bolder">bolder</a></p><p id="font_style">font-style设置字体倾斜</p><p id="color_en">⼀、关于颜⾊</p><p id="color_bin">除了使⽤英⽂单词，还可以使⽤⼗六进制颜⾊对应表(如下图，#FFFF00表⽰黄⾊，还可简写成#FF0）<table border="0"><tbody><tr><td height="30" width="95" bgcolor="#ffffff">#FFFFFF</td><td height="30" width="95" bgcolor="#dddddd">#DDDDDD</td><td height="30" width="95" bgcolor="#aaaaaa">#AAAAAA</td><td height="30" width="95" bgcolor="#888888">#888888</td><td height="30" width="95" bgcolor="#666666">#666666</td><td height="30" width="95" bgcolor="#444444">#444444</td><td height="30" width="95" bgcolor="#000000">#000000</td></tr><tr><td height="30" width="95" bgcolor="#ffb7dd">#FFB7DD</td><td height="30" width="95" bgcolor="#ff88c2">#FF88C2</td><td height="30" width="95" bgcolor="#ff44aa">#FF44AA </td><td height="30" width="95" bgcolor="#ff0088">#FF0088 </td><td height="30" width="95" bgcolor="#c10066">#C10066 </td><td height="30" width="95" bgcolor="#a20055">#A20055 </td><td height="30" width="95" bgcolor="#8c0044">#8C0044 </td></tr><tr><td height="30" width="95" bgcolor="#ffcccc">#FFCCCC</td><td height="30" width="95" bgcolor="#ff8888">#FF8888</td><td height="30" width="95" bgcolor="#ff3333">#FF3333 </td><td height="30" width="95" bgcolor="#ff0000">#FF0000 </td><td height="30" width="95" bgcolor="#cc0000">#CC0000 </td><td height="30" width="95" bgcolor="#aa0000">#AA0000 </td><td height="30" width="95" bgcolor="#880000">#880000 </td></tr><tr><td height="30" width="95" bgcolor="#ffc8b4">#FFC8B4</td><td height="30" width="95" bgcolor="#ffa488">#FFA488</td><td height="30" width="95" bgcolor="#ff7744">#FF7744 </td><td height="30" width="95" bgcolor="#ff5511">#FF5511 </td><td height="30" width="95" bgcolor="#e63f00">#E63F00 </td><td height="30" width="95" bgcolor="#c63300">#C63300 </td><td height="30" width="95" bgcolor="#a42d00">#A42D00 </td></tr><tr><td height="30" width="95" bgcolor="#ffddaa">#FFDDAA</td><td height="30" width="95" bgcolor="#ffbb66">#FFBB66</td><td height="30" width="95" bgcolor="#ffaa33">#FFAA33</td><td height="30" width="95" bgcolor="#ff8800">#FF8800 </td><td height="30" width="95" bgcolor="#ee7700">#EE7700 </td><td height="30" width="95" bgcolor="#cc6600">#CC6600 </td><td height="30" width="95" bgcolor="#bb5500">#BB5500 </td></tr><tr><td height="30" width="95" bgcolor="#ffee99">#FFEE99</td><td height="30" width="95" bgcolor="#ffdd55">#FFDD55</td><td height="30" width="95" bgcolor="#ffcc22">#FFCC22</td><td height="30" width="95" bgcolor="#ffbb00">#FFBB00 </td><td height="30" width="95" bgcolor="#ddaa00">#DDAA00 </td><td height="30" width="95" bgcolor="#aa7700">#AA7700 </td><td height="30" width="95" bgcolor="#886600">#886600 </td></tr><tr><td height="30" width="95" bgcolor="#ffffbb">#FFFFBB</td><td height="30" width="95" bgcolor="#ffff77">#FFFF77</td><td height="30" width="95" bgcolor="#ffff33">#FFFF33</td><td height="30" width="95" bgcolor="#ffff00">#FFFF00</td><td height="30" width="95" bgcolor="#eeee00">#EEEE00</td><td height="30" width="95" bgcolor="#bbbb00">#BBBB00</td><td height="30" width="95" bgcolor="#888800">#888800</td></tr><tr><td height="30" width="95" bgcolor="#eeffbb">#EEFFBB</td><td height="30" width="95" bgcolor="#ddff77">#DDFF77</td><td height="30" width="95" bgcolor="#ccff33">#CCFF33</td><td height="30" width="95" bgcolor="#bbff00">#BBFF00</td><td height="30" width="95" bgcolor="#99dd00">#99DD00</td><td height="30" width="95" bgcolor="#88aa00">#88AA00</td><td height="30" width="95" bgcolor="#ccff99">#CCFF99</td><td height="30" width="95" bgcolor="#bbff66">#BBFF66</td><td height="30" width="95" bgcolor="#99ff33">#99FF33</td><td height="30" width="95" bgcolor="#77ff00">#77FF00</td><td height="30" width="95" bgcolor="#66dd00">#66DD00</td><td height="30" width="95" bgcolor="#55aa00">#55AA00</td><td height="30" width="95" bgcolor="#227700">#227700</td></tr><tr><td height="30" width="95" bgcolor="#99ff99">#99FF99</td><td height="30" width="95" bgcolor="#66ff66">#66FF66</td><td height="30" width="95" bgcolor="#33ff33">#33FF33</td><td height="30" width="95" bgcolor="#00ff00">#00FF00</td><td height="30" width="95" bgcolor="#00dd00">#00DD00</td><td height="30" width="95" bgcolor="#00aa00">#00AA00</td><td height="30" width="95" bgcolor="#008800">#008800</td></tr><tr><td height="30" width="95" bgcolor="#bbffee">#BBFFEE</td><td height="30" width="95" bgcolor="#77ffcc">#77FFCC</td><td height="30" width="95" bgcolor="#33ffaa">#33FFAA</td><td height="30" width="95" bgcolor="#00ff99">#00FF99</td><td height="30" width="95" bgcolor="#00dd77">#00DD77</td><td height="30" width="95" bgcolor="#00aa55">#00AA55</td><td height="30" width="95" bgcolor="#008844">#008844</td></tr><tr><td height="30" width="95" bgcolor="#aaffee">#AAFFEE</td><td height="30" width="95" bgcolor="#77ffee">#77FFEE</td><td height="30" width="95" bgcolor="#33ffdd">#33FFDD</td><td height="30" width="95" bgcolor="#00ffcc">#00FFCC</td><td height="30" width="95" bgcolor="#00ddaa">#00DDAA</td><td height="30" width="95" bgcolor="#00aa88">#00AA88</td><td height="30" width="95" bgcolor="#008866">#008866</td></tr><tr><td height="30" width="95" bgcolor="#99ffff">#99FFFF</td><td height="30" width="95" bgcolor="#66ffff">#66FFFF</td><td height="30" width="95" bgcolor="#33ffff">#33FFFF</td><td height="30" width="95" bgcolor="#00ffff">#00FFFF</td><td height="30" width="95" bgcolor="#00dddd">#00DDDD</td><td height="30" width="95" bgcolor="#00aaaa">#00AAAA</td><td height="30" width="95" bgcolor="#008888">#008888</td></tr><tr><td height="30" width="95" bgcolor="#cceeff">#CCEEFF</td><td height="30" width="95" bgcolor="#77ddff">#77DDFF</td><td height="30" width="95" bgcolor="#33ccff">#33CCFF</td><td height="30" width="95" bgcolor="#00bbff">#00BBFF</td><td height="30" width="95" bgcolor="#009fcc">#009FCC</td><td height="30" width="95" bgcolor="#0088a8">#0088A8</td><td height="30" width="95" bgcolor="#007799">#007799</td></tr><tr><td height="30" width="95" bgcolor="#ccddff">#CCDDFF</td><td height="30" width="95" bgcolor="#99bbff">#99BBFF</td><td height="30" width="95" bgcolor="#5599ff">#5599FF</td><td height="30" width="95" bgcolor="#0066ff">#0066FF </td> <td height="30" width="95" bgcolor="#0044bb">#0044BB </td> <td height="30" width="95" bgcolor="#003c9d">#003C9D </td> <td height="30" width="95" bgcolor="#003377">#003377 </td> </tr><tr><td height="30" width="95" bgcolor="#ccccff">#CCCCFF</td><td height="30" width="95" bgcolor="#9999ff">#9999FF</td><td height="30" width="95" bgcolor="#5555ff">#5555FF </td> <td height="30" width="95" bgcolor="#0000ff">#0000FF </td> <td height="30" width="95" bgcolor="#0000cc">#0000CC </td> <td height="30" width="95" bgcolor="#0000aa">#0000AA </td> <td height="30" width="95" bgcolor="#000088">#000088 </td> </tr><tr><td height="30" width="95" bgcolor="#ccbbff">#CCBBFF</td><td height="30" width="95" bgcolor="#9f88ff">#9F88FF</td><td height="30" width="95" bgcolor="#7744ff">#7744FF </td> <td height="30" width="95" bgcolor="#5500ff">#5500FF </td> <td height="30" width="95" bgcolor="#4400cc">#4400CC </td> <td height="30" width="95" bgcolor="#2200aa">#2200AA </td> <td height="30" width="95" bgcolor="#220088">#220088 </td> </tr><tr><td height="30" width="95" bgcolor="#7700ff">#7700FF </td><td height="30" width="95" bgcolor="#5500dd">#5500DD </td><td height="30" width="95" bgcolor="#4400b3">#4400B3 </td><td height="30" width="95" bgcolor="#3a0088">#3A0088 </td></tr><tr><td height="30" width="95" bgcolor="#e8ccff">#E8CCFF</td><td height="30" width="95" bgcolor="#d28eff">#D28EFF</td><td height="30" width="95" bgcolor="#b94fff">#B94FFF </td><td height="30" width="95" bgcolor="#9900ff">#9900FF </td><td height="30" width="95" bgcolor="#7700bb">#7700BB </td><td height="30" width="95" bgcolor="#66009d">#66009D </td><td height="30" width="95" bgcolor="#550088">#550088 </td></tr><tr><td height="30" width="95" bgcolor="#f0bbff">#F0BBFF</td><td height="30" width="95" bgcolor="#e377ff">#E38EFF</td><td height="30" width="95" bgcolor="#d93eff">#E93EFF </td><td height="30" width="95" bgcolor="#cc00ff">#CC00FF </td><td height="30" width="95" bgcolor="#a500cc">#A500CC </td><td height="30" width="95" bgcolor="#7a0099">#7A0099 </td><td height="30" width="95" bgcolor="#660077">#660077 </td></tr><tr><td height="30" width="95" bgcolor="#ffb3ff">#FFB3FF</td><td height="30" width="95" bgcolor="#ff77ff">#FF77FF</td><td height="30" width="95" bgcolor="#ff3eff">#FF3EFF </td><td height="30" width="95" bgcolor="#ff00ff">#FF0 0FF </td><td height="30" width="95" bgcolor="#cc00cc">#CC00CC </td><td height="30" width="95" bgcolor="#990099">#990099 </td><td height="30" width="95" bgcolor="#770077">#770077 </td></tr></tbody></table></p><p id="color_rgb">颜⾊还可以使⽤rgb（255,0,255）的⽅式</p><p id="color_pellucidity">使⽤rgba(255,0,255,0.6)最后⼀位设置透明度,取值0-1，</p></body></html>View Code注意：可使⽤复合属性font，设置字体相关属性值，不同属性值之间使⽤空格隔开。

css属性大全中文对照表

css属性⼤全中⽂对照表Aalign-content 规定弹性容器内的⾏之间的对齐⽅式，当项⽬不使⽤所有可⽤空间时。

align-items 规定弹性容器内项⽬的对齐⽅式。

align-self 规定弹性容器内所选项⽬的对齐⽅式。

all 重置所有属性（除了 unicode-bidi 和 direction）。

animation 所有 animation-* 属性的简写属性。

animation-delay 规定开始动画的延迟。

animation-direction 规定动画是向前播放、向后播放还是交替播放。

animation-duration 规定动画完成⼀个周期应花费的时间。

animation-fill-mode 规定元素在不播放动画时（在开始之前、结束之后、或同时）的样式。

animation-iteration-count 规定动画的播放次数。

animation-name 规定 @keyframes 动画的名称。

animation-play-state 规定动画是播放还是暂停。

animation-timing-function 规定动画的速度曲线。

Bbackface-visibility 定义当⾯对⽤户时元素的背⾯是否应可见。

background 所有 background-* 属性的简写属性。

background-attachment 设置背景图像是与页⾯的其余部分⼀起滚动还是固定的。

background-blend-mode 规定每个背景图层（颜⾊/图像）的混合模式。

background-clip 定义背景（颜⾊或图像）应在元素内延伸的距离。

background-color 规定元素的背景⾊。

background-image 规定元素的⼀幅或多幅背景图像。

background-origin 规定背景图像的初始位置。

background-position 规定背景图像的位置。

background-repeat 设置是否以及如何重复背景图像。

CSS属性大全完整版

CSS属性大全完整版字体属性：(font)大小font-size:x-large; (特大) xx-small; (极小)一般中文用不到，只要用数值就可以，单位：PX、PD 样式font-style:oblique; (偏斜体) italic; (斜体) normal; (正常) 行高line-height:normal; (正常) 单位：PX、PD、EM粗细font-weight:bold; (粗体) lighter; (细体) normal; (正常)变体font-variant:small-caps; (小型大写字母) normal; (正常)大小写text-transform:capitalize; (首字母大写) uppercase; (大写)lowercase; (小写) none; (无)修饰text-decoration:underline; (下划线) overline; (上划线)line-through; (删除线) blink; (闪烁)常用字体font-family:"Courier New", Courier, monospace, "Times New Roman", Times, serif, Arial, Helvetica, sans-serif, Verdana背景属性：(background)色彩background-color: #FFFFFF;图片background-image: url();重复background-repeat: no-repeat;滚动background-attachment:fixed; (固定) scroll; (滚动)位置background-position:Left (水平) top (垂直);简写方法background:#000 url(..) repeat fixed left top;区块属性：(Block)字间距letter-spacing: normal; 数值对齐text-align:justify; (两端对齐) left; (左对齐)right; (右对齐) center; (居中)缩进text-indent: 数值px;垂直对齐vertical-align:baseline; (基线) sub; (下标) super; (下标)text-top; 文本顶端对齐| middle; 居中|bottom; 底部| text-bottom; 相对文本底端对齐词间距word-spacing: normal; 数值空格white-space:pre; (保留) nowrap; (不换行)显示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:; 内边距顺序：上右下左边框属性：(Border)border-style:dotted; (点线) dashed; (虚线) solid; (实线)double; (双线) groove; (槽线) ridge; (脊状)inset; (凹陷) outset; (外凸)border-width:; 边框宽度border-color:#; 边框颜色简写方法border：width style color;列表属性：(List-style)类型list-style-type:disc; (圆点) circle; (圆圈) square; (方块) decimal; (数字) lower-roman; (小写罗码数字) upper-roman; (大写罗码数字)lower-alpha; (小写字母) upper-alpha; (大写字母)位置list-style-position:outside; (外) inside; (里)图像list-style-image: url(..);定位属性：(Position)位置Position:absolute; 绝对位置|relative; 相对位置|static; 静止可见性visibility:inherit; 继承父元素| visible; 可见| hidden; 隐藏内容超出时overflow:visible; 可见| hidden; 隐藏| scroll; 滚动| auto; 自动裁切clip: rect(12px,auto,12px,auto)css属性代码大全一CSS文字属性：color : #999999; /*文字颜色*/font-family : 宋体,sans-serif; /*文字字体*/ font-size : 9pt; /*文字大小*/font-style:itelic; /*文字斜体*/font-variant:small-caps; /*小字体*/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 水平对齐text-align:right; /*文字右对齐*/text-align:left; /*文字左对齐*/text-align:center; /*文字居中对齐*/text-align:justify; /*文字分散对齐*/ vertical-align 垂直对齐vertical-align:top; /*垂直向上对齐*/ vertical-align:bottom; /*垂直向下对齐*/vertical-align:middle; /*垂直居中对齐*/vertical-align:text-top; /*文字垂直向上对齐*/ vertical-align:text-bottom; /*文字垂直向下对齐*/二、CSS边框空白padding-top:10px; /*上边框留空白*/padding-right:10px; /*右边框留空白*/padding-bottom:10px; /*下边框留空白*/ padding-left:10px; /*左边框留空白/三、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(/image/bg.gif); /*背景图片*/ background-attachment : fixed; /*浮水印固定背景*/ background-repeat : repeat; /*重复排列-网页默认*/ 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 : buttom; /*向下对齐*/background-position : left; /*向左对齐*/background-position : right; /*向右对齐*/background-position : center; /*居中对齐*/五、CSS连接属性：a /*所有超链接*/a:link /*超链接文字格式*/a:visited /*浏览过的链接文字格式*/a:active /*按下链接的格式*/a:hover /*鼠标经过链接*/鼠标光标样式：链接手指CURSOR: hand十字体cursor:crosshair箭头朝下cursor:s-resize十字箭头cursor:move箭头朝右cursor:move加一问号cursor:help箭头朝左cursor:w-resize箭头朝上cursor:n-resize箭头朝右上cursor:ne-resize箭头朝左上cursor:nw-resize文字I型cursor:text箭头斜右下cursor:se-resize箭头斜左下cursor:sw-resize漏斗cursor:wait光标图案(IE6) p {cursor:url("光标文件名.cur"),text;}六、CSS框线一览表：border-top : 1px solid #6699cc; /*上框线*/border-bottom : 1px solid #6699cc; /*下框线*/border-left : 1px solid #6699cc; /*左框线*/border-right : 1px solid #6699cc; /*右框线*/以上是建议书写方式,但也可以使用常规的方式如下: border-top-color : #369 /*设置上框线top颜色*/ border-top-width :1px /*设置上框线top宽度*/ border-top-style : solid/*设置上框线top样式*/其他框线样式solid /*实线框*/dotted /*虚线框*/double /*双线框*/groove /*立体内凸框*/ridge /*立体浮雕框*/inset /*凹框*/outset /*凸框*/七、CSS表单运用：<div><form><p>用户: <input type="text" class="text"></p>...</form></div>type属性取值单行文本域<p>用户: <input type="text" class="text"></p><input type="text" size="" maxlength="">单行的文本输入区域,size与maxlength属性用来定义此种输入区域显示的尺寸大小与输入的最大字符数多行文本域<p> <textarea cols="45" rows="5"></textarea></p>Cols：字符宽度rows：行数提交重置<p> <input type="submit" id="按钮" value="提交" /><input type="reset" id="重置" value="重置" /></p>提交到服务器的按钮,当这个按钮被点击时,就会连接到表单form属性action指定的url地址。

css教程菜鸟

css教程菜鸟CSS（层叠样式表）是一种用于描述网页上的元素布局和样式的语言，它能够使网页更加美观和易于阅读。

本文将介绍一些CSS的基础知识和常用属性，以帮助菜鸟入门。

首先，让我们了解一下CSS的基本语法。

CSS由选择器和声明块组成。

选择器指定了要应用样式的HTML元素，而声明块则包含了一系列属性-值对，用于描述要应用到元素上的样式。

下面是一个简单的示例：```p {color: red;font-size: 20px;}```上述代码中，选择器“p”表示要应用样式的HTML段落元素。

声明块中的属性-值对指定了段落的文本颜色为红色，字体大小为20像素。

接下来，我们将介绍一些常用的CSS属性。

1. 字体属性：用于设置文本的字体样式，如字体大小、字体族等。

例如：```p {font-size: 16px;font-family: Arial, sans-serif;}```上述代码将段落的字体大小设置为16像素，字体族为Arial或者sans-serif。

2. 背景属性：用于设置元素的背景样式，如背景颜色、背景图片等。

例如：```body {background-color: lightblue;background-image: url("bg.jpg");}```上述代码将页面的背景颜色设置为浅蓝色，背景图片为名为“bg.jpg”的图片。

3. 边框属性：用于设置元素的边框样式，如边框宽度、边框颜色等。

例如：```div {border: 1px solid black;}```上述代码将`<div>`元素的边框宽度设置为1像素，边框颜色为黑色。

4. 盒模型属性：用于调整元素的尺寸和定位，如元素的宽度、高度、外边距等。

例如：```img {width: 200px;height: 150px;margin-top: 10px;}```上述代码将图片的宽度设置为200像素，高度设置为150像素，并且向上外边距10像素。

CSS常用属性大全

CSS常用属性一 CSS文字属性：color : #999999; /*文字颜色*/font-family : 宋体,sans-serif; /*文字字体*/font-size : 9pt; /*文字大小*/font-style:itelic; /*文字斜体*/font-variant:small-caps; /*小字体*/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属性vertical-align:top; /*垂直向上对齐*/vertical-align:bottom; /*垂直向下对齐*/vertical-align:middle; /*垂直居中对齐*/vertical-align:text-top; /*文字垂直向上对齐*/ vertical-align:text-bottom; /*文字垂直向下对齐*/ 二、CSS边框空白padding-top:10px; /*上边框留空白*/padding-right:10px; /*右边框留空白*/padding-bottom:10px; /*下边框留空白*/padding-left:10px; /*左边框留空白三、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(/image/bg.gif); /*背景图片*/ background-attachment : fixed; /*浮水印固定背景*/ background-repeat : repeat; /*重复排列-网页默认*/ 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 : buttom; /*向下对齐*/background-position : left; /*向左对齐*/background-position : right; /*向右对齐*/background-position : center; /*居中对齐*/五、CSS连接属性a /*所有超链接*/a:link /*超链接文字格式*/a:visited /*浏览过的链接文字格式*/a:active /*按下链接的格式*/a:hover /*鼠标转到链接*/鼠标光标样式：链接手指 CURSOR: hand十字体 cursor:crosshair箭头朝下 cursor:s-resize十字箭头 cursor:move箭头朝右 cursor:move加一问号 cursor:help箭头朝左 cursor:w-resize箭头朝上 cursor:n-resize箭头朝右上 cursor:ne-resize箭头朝左上 cursor:nw-resize文字I型 cursor:text箭头斜右下 cursor:se-resize箭头斜左下 cursor:sw-resize漏斗 cursor:wait光标图案(IE6) p {cursor:url(“光标文件名.cur”),text;} 六、CSS框线一览表border-top : 1px solid #6699cc; /*上框线*/border-bottom : 1px solid #6699cc; /*下框线*/border-left : 1px solid #6699cc; /*左框线*/border-right : 1px solid #6699cc; /*右框线*/以上是建议书写方式,但也可以使用常规的方式如下:border-top-color : #369 /*设置上框线top颜色*/border-top-width :1px /*设置上框线top宽度*/border-top-style : solid/*设置上框线top样式*/其他框线样式solid /*实线框*/dotted /*虚线框*/double /*双线框*/groove /*立体内凸框*/ridge /*立体浮雕框*/inset /*凹框*/outset /*凸框*/七、CSS表单运用文字方块按钮复选框选择钮多行文字方块下拉式菜单选项1选项2八、CSS边界样式margin-top:10px; /*上边界*/margin-right:10px; /*右边界值*/margin-bottom:10px; /*下边界值*/margin-left:10px; /*左边界值*/九、CSS滤镜属性Filter：在样式中加上滤镜特效。

CSS常用样式属性大全

CSS常用样式属性大全1. 文本属性- `color`：设置文本颜色- `font-size`：设置字体大小- `font-family`：设置字体系列- `font-weight`：设置字体粗细- `text-align`：设置文本对齐方式- `text-decoration`：设置文本装饰（如下划线、删除线等）- `text-transform`：设置文本大小写转换2. 背景属性- `background-color`：设置背景颜色- `background-image`：设置背景图片- `background-repeat`：设置背景图片的重复方式- `background-position`：设置背景图片的位置- `background-size`：设置背景图片的尺寸3. 边框属性- `border`：设置元素边框样式、宽度和颜色- `border-radius`：设置元素边框的圆角- `border-color`：设置元素边框的颜色- `border-width`：设置元素边框的宽度4. 布局属性- `display`：设置元素的显示方式（如块级、内联等）- `width`：设置元素的宽度- `height`：设置元素的高度- `margin`：设置元素外边距- `padding`：设置元素内边距- `float`：设置元素的浮动方式5. 盒模型属性- `box-sizing`：设置元素的盒模型计算方式- `overflow`：设置元素溢出内容的处理方式- `position`：设置元素的定位方式- `top`：设置定位元素的上边距- `bottom`：设置定位元素的下边距- `left`：设置定位元素的左边距- `right`：设置定位元素的右边距以上是CSS中常用的样式属性，通过合理使用这些属性可以实现各种各样的页面效果。

在编写CSS代码时，建议将样式属性单独分行展示，以增加代码的可读性和维护性。

css属性大全

css属性大全CSS属性大全。

CSS（Cascading Style Sheets）是一种用来为网页添加样式和布局的样式表语言。

它可以控制网页的字体、颜色、间距、边框、背景等各种样式，是网页设计中不可或缺的一部分。

在这篇文档中，我们将详细介绍CSS中的各种属性，帮助您更好地掌握CSS的应用。

1. 字体属性。

字体属性用于设置网页中文本的字体样式、大小、粗细等。

常用的属性包括font-family（设置字体系列）、font-size（设置字体大小）、font-weight（设置字体粗细）、font-style（设置字体样式）等。

2. 文本属性。

文本属性用于设置文本的对齐方式、行高、间距等。

常用的属性包括text-align（设置文本对齐方式）、line-height（设置行高）、letter-spacing（设置字符间距）、word-spacing（设置单词间距）等。

3. 背景属性。

背景属性用于设置网页元素的背景样式。

常用的属性包括background-color（设置背景颜色）、background-image（设置背景图片）、background-repeat（设置背景重复方式）、background-position（设置背景位置）等。

4. 边框属性。

边框属性用于设置网页元素的边框样式。

常用的属性包括border-width（设置边框宽度）、border-style（设置边框样式）、border-color（设置边框颜色）、border-radius（设置边框圆角）等。

5. 盒模型属性。

盒模型属性用于设置网页元素的尺寸、内边距、外边距等。

常用的属性包括width（设置元素宽度）、height（设置元素高度）、padding（设置内边距）、margin（设置外边距）等。

6. 定位属性。

定位属性用于设置网页元素的位置。

常用的属性包括position（设置定位方式）、top（设置元素顶部位置）、left（设置元素左侧位置）、z-index（设置元素层级）等。

css 总结

css 总结CSS是网页设计中不可或缺的基础技术之一，它实现了网页的布局、样式和交互效果等方面的功能。

对于前端开发人员来说，掌握CSS 的基本知识和技巧非常重要，下面就对CSS进行一些简单的总结。

一、基本语法CSS代码由选择器和声明块组成，选择器用于确定需要应用样式的元素，而声明块则包含一个或多个属性和对应的值。

例如：```h1 {color: red;font-size: 24px;}```上面的代码使用了h1选择器，表示应用样式到网页中所有的h1元素。

花括号内是声明块，其中color和font-size是两个属性，而red和24px则是对应属性的值。

二、选择器CSS中有各种各样的选择器，用于指定需要应用样式的元素。

下面列出一些常见的选择器：- 标签选择器：根据元素的标签名来选择元素，如div、p、h1等；- 类选择器：根据元素的class属性来选择元素，用“.”加类名表示，如.class；- ID选择器：根据元素的id属性来选择元素，用“#”加id名称表示，如#id；- 伪类选择器：可以根据元素的状态来选择元素，如:hover表示当鼠标放在元素上方时的状态；- 后代选择器：可以通过两个或多个选择器的组合来选择元素，如divp表示选择div元素下的所有p元素。

三、基本样式属性CSS中有众多的样式属性，下面列出一些常用的基本样式属性：- color：设置文字的颜色，可以使用颜色名称、16进制RGB值或RGB值；- font-size：设置文字大小，可以使用像素、em、rem单位等；- background：设置元素的背景，可以设置颜色或背景图片等；- border：设置元素的边框，可以设置边框颜色、粗细和样式等；- margin：设置元素的外边距，可以设置上下左右四个方向的外边距；- padding：设置元素的内边距，可以设置上下左右四个方向的内边距。

四、盒模型CSS中的盒模型指的是网页中的元素在样式效果下所占的空间范围。

CSS中常用的五种编辑属性

CSS中常⽤的五种编辑属性CSS 字体属性属性描述font 简写属性。

作⽤是把所有针对字体的属性设置在⼀个声明中。

font-family 设置字体系列。

font-size 设置字体的尺⼨。

font-style 设置字体风格。

font-variant 以⼩型⼤写字体或者正常字体显⽰⽂本。

font-weight 设置字体的粗细。

CSS ⽂本属性属性描述color 设置⽂本颜⾊direction 设置⽂本⽅向。

line-height 设置⾏⾼。

letter-spacing 设置字符间距。

text-align 对齐元素中的⽂本。

text-decoration 向⽂本添加修饰。

text-indent 缩进元素中⽂本的⾸⾏。

text-transform 控制元素中的字母。

unicode-bidi 设置⽂本⽅向。

white-space 设置元素中空⽩的处理⽅式。

word-spacing 设置字间距。

CSS 边框属性属性描述border 简写属性，⽤于把针对四个边的属性设置在⼀个声明。

border-style ⽤于设置元素所有边框的样式，或者单独地为各边设置边框样式。

border-width 简写属性，⽤于为元素的所有边框设置宽度，或者单独地为各边边框设置宽度。

border-color 简写属性，设置元素的所有边框中可见部分的颜⾊，或为 4 个边分别设置颜⾊。

border-bottom 简写属性，⽤于把下边框的所有属性设置到⼀个声明中border-left 简写属性，⽤于把左边框的所有属性设置到⼀个声明中。

border-right 简写属性，⽤于把右边框的所有属性设置到⼀个声明中。

border-top 简写属性，⽤于把上边框的所有属性设置到⼀个声明中。

CSS 列表属性(list)属性描述list-style 简写属性。

⽤于把所有⽤于列表的属性设置于⼀个声明中。

list-style-image 将图象设置为列表项标志。

CSS属性大全

CSS属性⼤全1. ⽂字属性「字体族科」（font-family），设定时，需考虑浏览器中有⽆该字体。

「字体⼤⼩」（font-size），注意度量单位。

《绝对⼤⼩》|《相对⼤⼩》|《长度》|《百分⽐》(⼀般设置双数)「字体加粗」（font-weight），除了 normal（正常）、bold（粗体）、bolder（特粗）、lighter（细体）外，还有9种以像素为度量为单位的设置⽅式（100，200，300，400，500，600，700，800，900）。

「字体风格」（font-style），也就是字型。

（normal : 正常的字体italic : 斜体。

对于没有斜体变量的特殊字体，将应⽤obliqueoblique : 倾斜的字体）「字体变形」（font-variant），字体变形属性决定了字体显⽰是normal (普通) ，还是Small-caps（⼩型⼤写字母）当⽂字中所有字母都是⼤写的时候，⼩型⼤写字母（值）会显⽰⽐⼩写字母稍⼤的⼤写字符。

有正常（normal）和值（⾃定义间隔值）两种选择⽅式。

「字母间距」（letter-spacing），其作⽤与字符间距类似，也有正常（normal）和值（⾃定义间隔值）两种选择⽅式。

「垂直对齐」（vertical-align），控制⽂字或图像相对于其母体元素的垂直位置。

如将⼀个2×3像素的GIF图像同其母体元素⽂字的顶部垂直对齐，则该GIF图像将在该⾏⽂字的顶部显⽰。

共有基线（baseline，将元素的基准线同母体元素的基准线对齐）、下标（sub，将元素以下标的形式显⽰）,上标（super，将元素以上标的形式显⽰）、顶部（top ，将元素顶部同最⾼的母体元素对齐）、⽂本顶对齐（text-top，将元素的顶部同母体元素⽂字的顶部对齐）、中线对齐（middle，将元素的中点同母体元素的中点对齐）、底部（bottom，将元素的底部同最低的母体元素对齐）及值（⾃定义）等9种选择。

cascading style sheet手册

cascading style sheet手册Cascading Style Sheet（层叠样式表）是一种用于定义网页样式和布局的标记语言。

通过CSS，网页设计师可以轻松地控制网页的外观和风格，使网页更具吸引力和一致性。

本手册将为您介绍CSS的基本语法、常用属性以及实际应用技巧。

一、CSS基本语法CSS基本语法由选择器和声明块组成。

选择器用于选中要应用样式的HTML元素，而声明块则由一条或多条声明构成，每条声明由属性和对应的属性值组成。

例如，要为所有段落元素设置字体颜色为红色，可以使用以下CSS 代码：```p {color: red;}```二、CSS常用属性1. 字体属性- font-family：设置字体系列；- font-size：设置字体大小；- font-weight：设置字体粗细；- font-style：设置字体样式。

2. 背景属性- background-color：设置背景颜色；- background-image：设置背景图片；- background-size：设置背景图片尺寸；- background-repeat：设置背景图片是否平铺。

3. 盒模型属性- width：设置元素宽度；- height：设置元素高度；- margin：设置外边距；- padding：设置内边距；- border：设置边框样式。

4. 定位属性- position：设置元素定位方式；- top、right、bottom、left：设置元素相对于其父元素的位置偏移。

三、CSS实际应用技巧1. 选择器嵌套CSS允许选择器进行嵌套，提高样式定义的灵活性和可读性。

例如，要设置类名为"container"的div元素下的所有段落元素字体颜色为蓝色，可以使用以下CSS代码：```.container p {color: blue;}```2. 伪类和伪元素CSS提供了伪类和伪元素的功能，用于选中并添加样式到特定的元素。

常用的CSS标签标记属性翻译注释

常用的CSS标签标记属性翻译注释这里收藏一些编写网页的常用属性，便于以后编写网页查询。

" "这里收藏一些编写网页的常用属性，便于以后编写网页查询。

1、字体属性(type)font-family(使用什么字体)font-style(字体的样式，是否斜体)：normal/italic/obliquefont-variant(字体大小写)：normal/small-capsfont-weight(字体的粗细)：normal/bold/bolder/lithterfont-size(字体的大小)：absolute-size/relative-size/length/percentage2、颜色和背景属性(backgroud)color(定义前景色，例如：p{color:red})background-color(定义背景色)background-image(定义背景图片)background-repeat(背景图案重复方式)：repeat-x/repeat-y/no-repeatbackground-attachment(设置滚动)：scroll(滚动)/fixe(固定的)background-position(背景图案的初始位置)：percentage/length/top/left/right/bottom3、文本属性：(block)定义间距：word-spacing(单词之间的距离)letter-spacing(字母之间的距离)text-decoration(定义文字的装饰)：nore/underline/overline/line-through/blinkvertical-align(元素在垂直方向的位置)：baseline(基线)/sub/super/top/text-top/middle/bottom/text-bottomtext-transform(使文本转换为其它方式)：capitalize(大写)/uppercase(首字母大写)/lowercase(小写)/nonetext-align(文字的对齐)：left/right/center/justifytext-indent(文本的首行缩进)length/percentageline-height(文本的行高):normal/numbet/lenggth/percentage(百分比)定义超链接：a：link {color:green;text-decoration:nore}(未访问过的状态)a：visited {color:ren;text-decoration:underline;16pt}(访问过的状态)a:hover {color:blue;text-decoration:underline;16pt}(鼠标激活的状态)4、块属性(block)边距属性：margin-top(设置顶边距)margin-right(设置右边距)margin-bottom(设置底边距)margin-left(设置左边距)填充距属性：padding-top设置顶端真充距)padding-right设置顶端真充距)padding-bottom设置顶端真充距)padding-left设置顶端真充距)5、边框属性(border)border-top-width(顶端边框宽度)border-right-width(右端边框宽度)border-bottom-width(底端边框宽度)border-left-width(d左边框宽度)border-width(一次定义边框宽度)border-color(设置边框颜色)border-style(设置边框样式)border-top(一次定义顶端各种属性)border-right(一次定义右端各种属性)border-bottom(一次定义底端各种属性)border-left(一次定义左端各种属性)图文混排：width(定义宽度属性)height(定义高度属性)float(文字环绕在一个元素的四周)clear(定义某一边是否有环绕)6、项目符号和编号(list)display(定义是否显示)white-space(怎样处理空白部分)：normal/pre/nowraplist-style-type(在列表前加项目符号)disc(圆点)/circle(圈)/square（方形）/decimal（阿拉伯数字）/lower-roman(小写罗马数字)/upper-roman(大写罗马数字)/lower-alpha(小写英文字母)/upper-alpha(大写英文字母)/norelist-style-tyle(在列表前加图案):<url>/nonelist-style-position(决定列表项中第二行的起邕位置)list-style(一次性定义所有属性)7、定位（positioning）即层属性Type：设定对象的定位方式。

CSS标签属性大全

c s s样式大全(整‎理版）字体属性：(‎f ont)大小‎{font-size‎: x-large;‎}(特大) xx-s‎m all;(极小) ‎一般中文用不到，只要‎用数值就可以，单位‎：PX、PD样式‎{font-sty‎l e: obliqu‎e;}(偏斜体) i‎t alic;(斜体)‎normal;(正‎常)行高 {li‎n e-height:‎normal;}(‎正常) 单位：PX、‎P D、EM粗细‎{font-weig‎h t: bold;}‎(粗体) light‎e r;(细体) no‎r mal;(正常) ‎变体 {font-‎v ariant: s‎m all-caps;‎}(小型大写字母) ‎n ormal;(正常‎)大小写 {te‎x t-transfo‎r m: capita‎l ize;}(首字母‎大写) upperc‎a se;(大写) l‎o wercase;(‎小写) none;(‎无)修饰 {te‎x t-decorat‎i on: under‎l ine;}(下划线‎) overline‎;(上划线) lin‎e-through;‎(删除线) blin‎k;(闪烁)常用‎字体： (font-‎f amily)"Co‎u rier New"‎, Courier,‎monospace‎, "Times ‎New Roman‎", Times, ‎s erif, Ari‎a l, Helvet‎i ca, sans-‎s erif, Ve r‎d a n a背景属‎性：(backgro‎u nd)色彩 {‎b ackground‎-color: #F‎F FFFF;}图‎片 {backgro‎u nd-image:‎url();}‎重复 {backgr‎o und-repea‎t: no-repe‎a t;}滚动 {‎b ackground‎-attachmen‎t: fixed;}‎(固定) scrol‎l;(滚动)位置‎{backgrou‎n d-positio‎n: left;}(‎水平) top(垂直‎);简写方法 {‎b ac kgr oun d‎:#000 ur l(‎..) rep eat‎fi xed le f‎t top;} /*‎简写·这个在阅读代码‎中经常出现，要认真的‎研究*/区块属性：‎(Block) /‎*这个属性第一次认识‎，要多多研究*/ ‎字间距 {lett‎e r-spacing‎: normal;}‎数值 /*这个属性‎似乎有用，多实践下*‎/对齐 {tex‎t-align: j‎u stify;}(两‎端对齐) left;‎(左对齐) righ‎t;(右对齐) ce‎n ter;(居中) ‎缩进 {text-‎i ndent: 数值‎p x;}垂直对齐‎{vertical‎-align: ba‎s eline;}(基‎线) sub;(下标‎)super;(下‎标) top; te‎x t-top; mi‎d dle; bott‎o m; text-b‎o ttom;词间‎距word-spac‎i ng: norma‎l; 数值空格‎w hite-spac‎e: pre;(保留‎) nowrap;(‎不换行)显示‎{display:‎b lock;}(块)‎inline;(内‎嵌) list-it‎e m;(列表项) r‎u n-in;(追加部‎分) compact‎;(紧凑) mark‎e r;(标记) ta‎b le; inlin‎e-tableta‎b le-raw-gr‎o up; table‎-header-gr‎o up; table‎-footer-gr‎o up; table‎-raw; tabl‎e-column-g‎r oup; tabl‎e-column; ‎t able-cell‎;table-ca‎p tion;(表格标‎题) /*displ‎a y 属性的了解很模‎糊*/方‎框属性： (Box)‎ width:; ‎h eight:; f‎l oat:; cle‎a r:both; m‎a rgin:; pa‎d ding:;顺序‎：上右下左边框属‎性： (Border‎) border-‎s tyle: dot‎t ed;(点线) d‎a shed;(虚线)‎solid; do‎u ble;(双线) ‎g roove;(槽线‎)ridge;(脊‎状) inset;(‎凹陷) outset‎;border-w‎i dth:; 边框宽‎度 border-c‎o lor:#; 简‎写方法border：‎w idth styl‎e color; /‎*简写*/列表属性‎：(List-st‎y le) 类型li‎s t-style-t‎y pe: disc;‎(圆点) circl‎e;(圆圈) squ‎a re;(方块) ‎d ecimal;(数‎字) lower-r‎o man;(小罗码数‎字) upper-r‎o man; lowe‎r-alpha; u‎p per-alpha‎;位置list‎-style-pos‎i tion: out‎s ide;(外) i‎n side;图像‎l ist-style‎-image: ur‎l(..);定‎位属性： (Posi‎t ion) Pos‎i tion: abs‎o lute; rel‎a tive; sta‎t ic; visib‎i lity: inh‎e rit; visi‎b le; hidde‎n; overflo‎w: visible‎;hidden; ‎s croll; au‎t o; clip: ‎r ect(12px,‎a uto,12px,‎a uto) (裁切)‎css属性代码大全‎一 CSS文字属性‎：color ‎: #999999;‎/*文字颜色*/ ‎font-fam‎i ly : 宋体,s‎a ns-serif;‎/*文字字体*/ ‎font-siz‎e : 9pt; /‎*文字大小*/‎f ont-style‎:itelic; /‎*文字斜体*/ ‎font-vari‎a nt:small-‎c aps; /*小字‎体*/lett‎e r-spacing‎: 1pt; /*‎字间距离*/l‎i ne-height‎: 200%; /‎*设置行高*/‎f ont-weigh‎t:bold; /*‎文字粗体*/v‎e rtical-al‎i gn:sub; /‎*下标字*/v‎e rtical-al‎i gn:super;‎/*上标字*/ ‎text-dec‎o ration:li‎n e-through‎; /*加删除线*/‎text-de‎c oration: ‎o verline; ‎/*加顶线*/‎t ext-decor‎a tion:unde‎r line; /*加‎下划线*/te‎x t-decorat‎i on:none; ‎/*删除链接下划线*‎/text-t‎r ansform :‎capitaliz‎e; /*首字大写*‎/text-t‎r ansform :‎uppercase‎; /*英文大写*/‎text-tr‎a nsform : ‎l owercase;‎/*英文小写*/ ‎text-ali‎g n:right; ‎/*文字右对齐*/ ‎text-ali‎g n:left; /‎*文字左对齐*/ ‎text-ali‎g n:center;‎/*文字居中对齐*‎/text-a‎l ign:justi‎f y; /*文字分散‎对齐*/ver‎t ical-alig‎n属性vert‎i cal-align‎:top; /*垂直‎向上对齐*/v‎e rtical-al‎i gn:bottom‎; /*垂直向下对齐‎*/verti‎c al-align:‎m iddle; /*‎垂直居中对齐*/ ‎vertical‎-align:tex‎t-top; /*文‎字垂直向上对齐*/ ‎vertical‎-align:tex‎t-bottom; ‎/*文字垂直向下对齐‎*/二、CSS‎边框空白pad‎d ing-top:1‎0px; /*上边框‎留空白*/pa‎d ding-righ‎t:10px; /*‎右边框留空白*/ ‎padding-b‎o ttom:10px‎; /*下边框留空白‎*/paddi‎n g-left:10‎p x; /*左边框留‎空白三、CSS符‎号属性：lis‎t-style-ty‎p e:none; /‎*不编号*/‎l ist-style‎-type:deci‎m al; /*阿拉伯‎数字*/li‎s t-style-t‎y pe:lower-‎r oman; /*小‎写罗马数字*/‎l ist-style‎-type:uppe‎r-roman; /‎*大写罗马数字*/ ‎list-sty‎l e-type:lo‎w er-alpha;‎/*小写英文字母*‎/list-s‎t yle-type:‎u pper-alph‎a; /*大写英文字‎母*/list‎-style-typ‎e:disc; /*‎实心圆形符号*/ ‎list-styl‎e-type:cir‎c le; /*空心圆‎形符号*/li‎s t-style-t‎y pe:square‎; /*实心方形符号‎*/list‎-style-ima‎g e:url(/do‎t.gif); /*‎图片式符号*/‎l ist-style‎-position:‎outside; ‎/*凸排*/l‎i st-style-‎p osition:i‎n side; /*缩‎进*/四、CS‎S背景样式：b‎a ckground-‎c olor:#F5E‎2EC; /*背景颜‎色*/back‎g round:tra‎n sparent; ‎/*透视背景*/ ‎backgrou‎n d-image :‎url(/imag‎e/bg.gif);‎/*背景图片*/ ‎backgrou‎n d-attachm‎e nt : fixe‎d; /*浮水印固定‎背景*/bac‎k ground-re‎p eat : rep‎e at; /*重复排‎列-网页默认*/ ‎backgroun‎d-repeat :‎no-repeat‎; /*不重复排列*‎/backgr‎o und-repea‎t : repeat‎-x; /*在x轴重‎复排列*/ba‎c kground-r‎e peat : re‎p eat-y; /*‎在y轴重复排列*/ ‎指定背景位置‎backgroun‎d-position‎: 90% 90%‎; /*背景图片x与‎y轴的位置*/ ‎b ackground‎-position ‎: top; /*向‎上对齐*/ba‎c kground-p‎o sition : ‎b uttom; /*‎向下对齐*/b‎a ckground-‎p osition :‎left; /*向‎左对齐*/ba‎c kground-p‎o sition : ‎r ight; /*向‎右对齐*/ba‎c kground-p‎o sition : ‎c enter; /*‎居中对齐*/五‎、CSS连接属性：‎a /*所有超链接‎*/a:li‎n k /*超链接文字‎格式*/a:v‎i sited /*浏‎览过的链接文字格式*‎/a:acti‎v e /*按下链接的‎格式*/a:h‎o ver /*鼠标转‎到链接*/鼠标‎光标样式：链接手‎指 CURSOR: ‎h and十字体‎cursor:cr‎o sshair‎箭头朝下 curso‎r:s-resize‎十字箭头 cu‎r sor:move ‎箭头朝右 cur‎s or:move ‎加一问号 curs‎o r:help ‎箭头朝左 curs‎o r:w-resiz‎e箭头朝上 c‎u rsor:n-re‎s ize箭头朝‎右上 cursor:‎n e-resize ‎箭头朝左上 cu‎r sor:nw-re‎s ize文字I‎型 cursor:t‎e xt箭头斜‎右下 cursor:‎s e-resize ‎箭头斜左下 cu‎r sor:sw-re‎s ize漏斗‎c ursor:wai‎t光标图案(‎I E6) p {‎c ursor:url‎("光标文件名.cu‎r"),text;}‎六、CSS框线‎一览表：bor‎d er-top : ‎1px solid ‎#6699cc; /‎*上框线*/b‎o rder-bott‎o m : 1px s‎o lid #6699‎c c; /*下框线*‎/border‎-left : 1p‎x solid #6‎699cc; /*左‎框线*/bor‎d er-right ‎: 1px soli‎d #6699cc;‎/*右框线*/ ‎以上是建议书写方式‎,但也可以使用常规的‎方式如下:bo‎r der-top-c‎o lor : #36‎9 /*设置上框线t‎o p颜色*/b‎o rder-top-‎w idth :1px‎/*设置上框线to‎p宽度*/bo‎r der-top-s‎t yle : sol‎i d/*设置上框线t‎o p样式*/其‎他框线样式so‎l id /*实线框*‎/dotted‎/*虚线框*/ ‎double /*‎双线框*/g‎r oove /*立体‎内凸框*/ri‎d ge /*立体浮雕‎框*/inse‎t /*凹框*/ ‎outset /*‎凸框*/七、C‎S S表单运用：文‎字方块按钮‎复选框选择钮‎多行文字方块‎下拉式菜单‎选项1选项2八‎、CSS边界样式：‎margin-to‎p:10px; /*‎上边界*/m‎a rgin-righ‎t:10px; /*‎右边界值*/m‎a rgin-bott‎o m:10px; /‎*下边界值*/‎m argin-lef‎t:10px; /*‎左边界值*/ ‎CSS 属性：字‎体样式(Font S‎t yle)序号‎中文说明标记语法‎1 字体样式‎{font:fon‎t-style fo‎n t-variant‎font-weig‎h t font-si‎z e font-fa‎m ily}2 ‎字体类型 {fo‎n t-family:‎"字体1","字体2‎","字体3",..‎.}3 字体大‎小 {font-‎s ize:数值|in‎h erit| med‎i um| large‎| larger| ‎x-large| x‎x-large| s‎m all| smal‎l er| x-sma‎l l| xx-sma‎l l}4 字体‎风格 {font‎-style:inh‎e rit|itali‎c|normal|o‎b lique}‎5字体粗细‎{font-wei‎g ht:100-90‎0|bold|bol‎d er|lighte‎r|normal;}‎6 字体颜色‎ {color:‎数值;}7 阴‎影颜色 { tex‎t-shadow:1‎6位色值}8 ‎字体行高 {‎l ine-heigh‎t:数值|inher‎i t|normal;‎}9 字间‎距 {let‎t er-spacin‎g:数值|inher‎i t|normal}‎10 单词间距‎ {word-s‎p acing:数值|‎i nherit|no‎r mal}11‎字体变形 {f‎o nt-varian‎t:inherit|‎n ormal|sma‎l l-cps } ‎12 英文转换‎{text-tran‎s form:inhe‎r it|none|c‎a pitalize|‎u ppercase|‎l owercase}‎13 字体变形‎ {font-s‎i ze-adjust‎:inherit|n‎o ne}14字‎体{font-st‎r etch:cond‎e nsed|expa‎n ded|extra‎-condensed‎|extra-exp‎a nded|inh‎e rit|narro‎w er|normal‎|semi-c‎o ndensed|s‎e mi-expand‎e d|ultra-c‎o ndensed|u‎l tra-expan‎d ed|wider}‎文本样式(Te‎x t Style) ‎序号中文说明‎标记语法1 行‎间距 {li‎n e-height:‎数值|inherit‎|normal;} ‎2 文本修饰 {‎t ext-decor‎a tion:inhe‎r it|none|u‎n derline|o‎v erline|li‎n e-through‎|blink} ‎3段首空格 {‎t ext-inden‎t:数值|inher‎i t}4 水平‎对齐 {text‎-align:lef‎t|right|ce‎n ter|justi‎f y}5 垂直‎对齐{vertic‎a l-align:i‎n herit|top‎|bottom|te‎x t-top|tex‎t-bottom|b‎a seline|mi‎d dle|sub|s‎u p er}6 ‎书写方式 {wr‎i ting-mode‎:lr-tb|tb-‎r l}背景样式‎序号中文说明‎标记语法1 背‎景颜色 {bac‎k ground-co‎l or:数值}‎2背景图片 {‎b ackground‎-image: ur‎l(URL)|non‎e}3 背景重‎复 {backgr‎o und-repea‎t:inherit|‎n o-repeat|‎r epeat|rep‎e at-x|repe‎a t-y}4 ‎背景固定 {ba‎c kground-a‎t tachment:‎f ixed|scro‎l l}5 背景‎定位 {back‎g round-pos‎i tion:数值|t‎o p|bottom|‎l eft|right‎|center} ‎6 背影样式‎{backgroun‎d:背景颜色|背景图‎象|背景重复|背景附‎件|背景位置}框架‎样式(Box Sty‎l e)序号中‎文说明标记语法‎1 边界留白‎{margin:ma‎r gin-top m‎a rgin-righ‎t margin-b‎o ttom marg‎i n-left} ‎2 补白‎{padding:p‎a dding-top‎padding-r‎i ght paddi‎n g-bottom ‎p adding-le‎f t}3 边框‎宽度{bor‎d er-width:‎b order-top‎-width bor‎d er-right-‎w idth bord‎e r-bottom-‎w idth bord‎e r-left-wi‎d th} 宽度‎值： thin|me‎d ium|thick‎|数值4 边框‎颜色 {bord‎e r-color:数‎值数值数值数值‎}数值：分别代表‎t op、right、‎b ottom、lef‎t颜色值5 边‎框风格{bord‎e r-style:n‎o ne|hidden‎|inherit|d‎a shed|soli‎d|double|i‎n set|outse‎t|ridge|gr‎o ove}6 边‎框 {bord‎e r:border-‎w idth bord‎e r-style c‎o lor}上边‎框{border-‎t op:border‎-top-width‎border-st‎y le color}‎右边框‎ {border-‎r ight:bord‎e r-right-w‎i dth borde‎r-style co‎l or}下‎边框 {bor‎d er-bottom‎:border-bo‎t tom-width‎border-st‎y le color}‎左边框‎ {border-‎l eft:borde‎r-left-wid‎t h border-‎s tyle colo‎r}7 宽‎度 {width‎:长度|百分比| a‎u to}8 高‎度 {hei‎g ht:数值|aut‎o}9 漂‎浮 {float‎:left|righ‎t|none}‎10 清除‎{clear:non‎e|left|rig‎h t|both}‎分类列表序号中文‎说明标记语法‎1 控制显示 {d‎i splay:non‎e|block|in‎l ine|list-‎i tem}2 ‎控制空白 {whit‎e-space:no‎r mal|pre|n‎o warp}3‎符号列表{lis‎t-style-ty‎p e:disc|ci‎r cle|squar‎e|decimal|‎l ower-roma‎n|upper-ro‎m an|lower-‎a lpha |uppe‎r-alpha|no‎n e}4 图形‎列表 {list‎-style-ima‎g e:URL}‎5位置列表 {‎l ist-style‎-position:‎i nside|out‎s ide}6 ‎目录列表 {li‎s t-style:目‎录样式类型|目录样式‎位置|url}‎7鼠标形状{c‎u rsor:hand‎|crosshair‎|text|wait‎|move|help‎|e-resize|‎n w-resize|‎w-resize|s‎-resize |se‎-resize|sw‎-resize}‎。

常用css样式

常用css样式常用CSS样式CSS是一种用于网页设计的样式表语言，它可以为网页添加样式和布局，使其看起来更美观和易于导航。

以下是常用的CSS样式。

一、文本样式1.字体大小使用font-size属性可以设置文本的大小，单位可以是像素(px)、百分比(%)或em。

例如：p {font-size: 16px;}2.字体颜色使用color属性可以设置文本的颜色，可以使用颜色名称或十六进制值。

例如：p {color: red;}3.字体样式使用font-style属性可以设置文本的样式，包括normal（默认）、italic（斜体）和oblique（倾斜）。

例如：p {font-style: italic;}4.字体粗细使用font-weight属性可以设置文本的粗细程度，包括normal（默认）、bold（加粗）和lighter（细）。

例如：p {font-weight: bold;}5.行高使用line-height属性可以设置文本行与行之间的距离。

例如：p {line-height: 1.5;}二、背景样式1.背景颜色使用background-color属性可以设置元素的背景颜色，可以使用颜色名称或十六进制值。

例如：div {background-color: #f0f0f0;}2.背景图片使用background-image属性可以为元素添加背景图片，可以使用相对或绝对路径。

例如：div {background-image: url("bg.jpg");}3.背景重复使用background-repeat属性可以设置背景图片的重复方式，包括repeat（默认）、repeat-x、repeat-y和no-repeat。

例如：div {background-repeat: no-repeat;}4.背景位置使用background-position属性可以设置背景图片的位置，可以使用关键字（如top、bottom、left和right）或像素值。

第11讲 CSS常用属性

• 在CSS代码中，使用font-family属性可以设置字体族，设置语法如下：
font-family: 字体族1,字体族2,...,通用字体族 | inherit;
• font-family的各个取值含义如下表所示：
设置了多个字体族时，浏览器显示文本内容时将按指定的字体的先后顺序选择其中一个字体，即首先会检查浏览器是否支持第一个字体，如果支持，则选择该字体，否则按书写顺序检查第二个字体，依此类推。
line-height: normal|number|length|百分数| inherit;
• 语法说明：
✓ “normal”表示使用默认行高，为默认值。 ✓ “number”表示不带任何单位的某个数字。行间距等于
此数字与当前的字体尺寸相乘的结果。 ✓“length”表示以 px|em|pt 为单位的某个数值。 ✓ “百分数”表示相对于当前字体大小的百分数。100%
1. color属性
• 在CSS代码中，使用color属性设置文本颜色，设置语法如下：
color:颜色英文单词|颜色的十六进制数|颜色的rgb值|inherit;
• 语法说明：
CSS3还可以设置 rgba值
✓ rgb使用：rgb(num,num,num)格式来表示颜色，其中r
代表红色，g代表绿色，b代表蓝色，小括号里的3个num分
3. font-size属性
• 在CSS代码中，使用font-size属性可以设置字体的大小，设置语法如下：
font-size: medium | length | 百分数 | inherit;
• font-size的各个取值含义如下表所示：
em和%单位具有可伸缩性， 1em=100%
4. font-family属性

css代码大全

css属性代码大全一CSS文字属性:color : #999999; /*文字颜色*/ font-fam i I y :宋体，sans-ser if; /*文字字体*/ font-size : 9pt; /*文字大小*/ font-style: iteI ic; /*文字斜体*/ font-variant:smal Heaps; /*小字体*/ letter-spacing : 1pt; /*字间距离*/I ine-height : 200%; /*设置行高*/ font-weight:bold; /*文字粗体*/ vertical-al ign:sub; /*下标字*/ vertical-align:super; /*上标字*/ text-decor at i on: I i ne-through; /* 力口删除线*/ text - decora t i on: over line; /* 力匕顶线*/ text - decor a t i on: under I i ne; /* 力。

下戈U 线*/ text-decoration:none; /*刪除链接下划线*/ text-transform : capital ize; /*首字大写*/ text-transform : uppercase; /*英文大写*/ text-transform : Iowercase; /*英文小写*/ text-a I ign: r ight; /*文字右对齐*/ text-aI ign: left; /*文字左对齐*/ text-a I ign:center ； /*文字居中对齐*/ text-al ign: justify; /*文字分散对齐*/ ver ti cal-a I ign 属性A Bvert i cal-a I ign: top; /* 垂直向上对齐*/ vert i cal-a I i gn: bottom; /* 垂直向下对齐 */ vertical-al ign:middle; /*垂直居中对齐*/ vertical-a I ign： text-top; /* 文字垂直向上对齐 */ vertical-a I i gn： text-bottom；/* 文字垂直向下对齐 */二、css边框空白padding-top: 10px; /*上边框留空白*/padd i ng-r i ght: 10px; /*右边框留空白*/(padding-bottom: 10px; /*下边框留空白*/ padding-1 eft:10px; /*左边框留空白三、CSS符号属性：I i st-sty I e-type: none; /* 不编号*/I i st - sty I e-type: deci ma I ; /* 阿拉伯数字 */I ist-sty Ie-type: Iower-roman; /*小写罗马数字*/I i st-sty I e-type: upper-roman; /*大写罗马数字*/I ist-styIe-type: lower-alpha; /*小写英文字母*/ $I i st - sty I e-type: upper-alpha; /*大写英文字母 */I i st-sty I e-type:di sc; /*实心圆形符号*/I i st-sty I e-type:ci rc I e; /*空心圆形符号*/I i st-sty I e-type: square; /*实心方形符号*/I i st-sty I e~image:ur I (/; /*图片式符号*/I ist-styIe-position: outside; /*凸排*/I ist-sty Ie-position: inside; /*缩进*/四、CSS背景样式：background-co I or: #F5E2EC; /*背景颜色*/ background:transparent; /*透视背景*/ background-image : ur I (/image/; /*背景图片 */ background-attachment : f i xed; /*浮水印固定背景*/ background-repeat : repeat; /*重复排列-网页默认*/ background-repeat : no-repeat; /*不重复排列*/ background-repeat : repeat-x; /*在x轴重复排列*/ background-repeat : repeat-y; /*在y轴重复排列*/ 指定背景位置background - posit ion : 90% 90%; /* 背景图片x与y轴的位置*/a /*所有超链接*/a: I ink /*超链接文字格式*/ a:visited /*浏览过的链接文字格式*/ a:active /*按下链接的格式*/a:hover /*鼠标转到链接*/鼠标光标样式:链接手指CURSOR: hand十字体 cursor :crosshai r箭头朝下 cursor: s-res i ze十字箭头cursor move箭头朝右cursor :move加一问号 cursor:he Ip箭头朝左 cursor :w-resize箭头朝上 cursor :n-resizeI箭头朝右上 cursor:ne~resize箭头朝左上 cursor:nw-resize文字 I 型 cursor: text箭头斜右下 cursor: se-resize箭头斜左下 cursor: sw-resi ze漏斗 cursor:wait光标图案(IE6) p (cursor:ur I ("光标文件名.cur"), text;)六、CSS 框线一览表：background-pos i t i on background-pos i t i on background-pos i t i on background-posi t i on background-pos i t i on:top; /*向上对齐*/:buttom; /*向下对齐*/:left; /*向左对齐*/:right; /*向右对齐*/ :center; /*居中对齐*/border-top : 1px solid #6699cc; /*上框线*/ border-bottom : 1 px solid #6699cc; /*下框线*/ border-left : 1 px solid #6699cc; /*左框线*/ border-r i ght : 1px solid #6699cc; /* 右框线 */ 以上是建议书写方式，但也可以使用常规的方式如下: border-top-color : #369 /*设置上框线top颜色*/ border-top-width : 1 px /*设置上框线top宽度*/ border-top-style : so I i d/* 设置上框线top 样式 */其他框线样式sol id /*实线框*/dotted /*虚线框*/ doub I e /*双线框*/ groove /*立体内凸框*/ ridge /*立体浮雕框*/ inset /*凹框*/ outset /*凸框*/>七、CSS表单运用：文字方块按钮复选框选择钮多行文字方块下拉式菜单选项1选项2八、CSS边界样式：Imargin-top: 10px; /*上边界*/marg i n~r i ght: 10px; /*右边界值*/ margin-bottom: 10px; /*下边界值*/ margin-1 eft: 10px; /* 左边界值*/CSS属性：字体样式(Font Sty I e)序号中文说明标记语法I字体样式｛font:font-style font-variant font-weight font-sizefont一fami Iy)2字体类型｛font-fami ly:H字体1”字体2","字体3",...｝3字体大小｛font-size:数值| inher i11 medium| I arge| Iarger | xTargelxx-1arge| smaI I| smaI I er| x-smaI I| xx-smaI I｝4字体风格｛font-sty I e: i nher it | ita I ic | norma I | ob I ique)5字体粗细｛f ont-we i ght: 100-9001 bo I d (粗体)|bolder (特紐)〔lighter (细体)|normaI (正常);)6字体颜色｛color：数值汀7阴影颜色｛text-shadow: 16位色值｝8字体行高｛I ine-height:数值| inher it |normal;)9字间距｛letter-spacing:数值| inher i11norma I)10单词间距｛word-spacing:数值| inher i11 norma I)II字体变形｛font-variant: i nherit| norma I | sma I l-cps ｝12英文转换｛text-transform:i nher i 11none|cap i taIi ze|uppercase|Iowercase)13 字体变形｛font-size - ad just: i nher it | none)14字体｛font-stretch:condensed|expanded|extra-condensed|extra-expanded|i nherit|narrower|norma I|semi-condensed|semi-expanded|uItra-condensed|uItra-expanded|wi der)文本样式(Text Sty I e)序号中文说明标记语法1 行间距｛I i ne-he i ght:数值 | i nher i11 norma I ;)2文本修饰｛text-decorat i on:i nher i 11none|under Ii ne|over Ii ne|Ii ne~through|bIi nk)3段首空格(text-indent:数值| inher it)4水平对齐｛text-a I i gn: I eft | r i ght | center | just i fy)5垂直对齐{vert i caI-a I i gn:i nher i 11top|bottom|text-top|text-bottom|base Ii ne|mi dd Ie|sub|super)6书写方式{wr i t i ng-mode: I r-tb 11b-r I}背景样式序号中文说明标记语法1背景颜色{background-co I or:数值}2背景图片{background- image: ur I (URL) | none)3背景重复{background-repeat:i nher i11no-repea11repea11repeat-x|repeat-y}4背景固定{background-attachment: f i xed | scro I I}5背景定位{background-position:数值|top|bottom| left|right|center}6背影样式{background:背景颜色|背景图象|背景重复|背景附件|背景位置} 框架样式(Box Style)序号中文说明标记语法1边界留白{margi n:margi n-top margin-r igh t margin-bo ttom marg in-1 eft} 2补白{padding:padding-top padding-r ight padding-bottom padding-left}3边框宽度{border-width:border-top-width border-r ight-widthborder-bottom-wi dth border-1eft-wi dth}宽度值:t hin|medium|thick| 数值4边框颜色(border-color:数值数值数值数值} 数值：分别代表top、right、bottom I eft 颜色值5边框风格{border-styIe:none|h i dden|i nher i11dashed|so I i d|doubIe|i nse11outset|r i dge|groove)6边框{border:border-wi dth border-style co I or)上边框[border-top:border-top-width border-style color) 右边框[border-r i ght:border-right-wi dth border-style co I or) 下边框{border-bottom:border-bottom-wi dth border-style co I or) 左边框{border-left:border-left-wi dth border-style co I or) 7宽度(width:长度J百分比| auto)8高度(he i ght:数值 | auto)9漂浮(fI oat:I eft|r i ght|none)10清除[cI ear:none|I eft|r i ght|both)分类列表序号中文说明标记语法1控制显示{display:none|block| inI ine| I ist-item)2控制空白{white-space:normal |pre|nowarp}3符号列表{Ii st-styIe-type:d i sc|c i rcIe|square|deci ma I|Iower-roman|upper-roman|I ower-aIpha|upper-aIpha|none)4图形列表{I i st-sty I e-image: URL)5位置歹〔J 表{I i s t-sty le-posi ti on:inside|o ut side)6目录列表{list-style: 0录样式类型|目录样式位置|url)7鼠标形状(cursor:hand|crossha i r|text|wa i 11move|he Ip|e-res i ze|nw-res i ze|w-res i z e|s~res i ze|se-res i ze|sw-res i ze)CSS属性大全［背景］属性共有六项:「背景颜色」(background-color),设置背景颜色。

ASP CSS常用属性

ASP CSS常用属性上节简要介绍了CSS的基本语法，主要对如何定义样式表和引入样式表进行讲解。

从其语法中可以看出，属性是CSS非常重要的部分。

掌握了CSS的各种属性是编辑页面样式表的前提条件，因此本节将介绍一些常用的CSS属性。

1．字体属性字体属性是使用最多，也是最基本的属性，表6-1列出了它的主要属性。

表6-1 字体属性下面使用表6-1中的字体属性定义一种字体样式“.FontStyle”，样式字体类型为中文使用“宋体”，英文使用“MS Serif”,并且是斜体、小型大写字母、粗体、36除了上面介绍的字体样式属性外，还可以用样式表控制字体的颜色和背景属性，使字体不再是单纯的黑白显示。

控制字体颜色及背景的CSS属性见表6-2所示：表6-2 颜色和背景属性下面以一个示例来演示如何使用颜色和背景属性样式，如图6-5所示是示例效果。

图6-5 颜色及背景属性为了达到上述效果，可在字体属性的示例中添加如下代码所示的颜色和背景图像属性。

通过本示例，读者要明白使用样式表可以实现比使用HTML的Font标记实现更多的控制，当然也可以使用HTML标记background指定背景属性。

3．排版属性前面介绍了如何用CSS定义字体、颜色和背景属性，那么接下来将为定义好的文本进行排版。

表6-3列出CSS中用于控件文本的排版的属性：表6-3 颜色和背景属性行与行之间行高，对齐方式变成两端齐，并且段首还进行处缩进。

显示效果如图6-6所示：图6-6 排版属性样式利用CSS的文本属性可以很方便地对页面中的文本进行排版。

如下代码所示是实现该显示效果的示例代码：CSS的容器属性包括边距、填充距、边框和宽度、高度、浮动、清除等属性。

在网页中的内容必须“装”进这个“容器”中。

“容器”属性是CSS中非常重要的一种属性。

下面将对“容器”属性进行分类介绍。

首先介绍边距属性，表6-4列出了容器属性中常用的边距属性。

表6-4 边距属性定义了边距后的页面，无论怎么改变窗口的大小，都会按照定义好的边距样式显示。

CSS_style属性大全

CSS style属性大全显示:标签属性/属性行为集合事件滤镜方法对象样式一、标签属性属性描述ALIGN align 设置或获取表格排列。

ALLOWTRANSPARENCY allowTransparency 设置或获取对象是否可为透明。

APPLICATION APPLICATION 表明对象的内容是否为HTML 应用程序(HTA)，以便免除浏览器安全模式。

ATOMICSELECTION 指定元素及其内容是否可以一不可见单位统一选择。

BEGIN begin 设置或获取时间线在该元素上播放前的延迟时间。

BORDER border 设置或获取框架间的空间，包括3D 边框。

canHaveChildren 获取表明对象是否可以包含子对象的值。

canHaveHTML 获取表明对象是否可以包含丰富的HTML 标签的值。

CLASS className 设置或获取对象的类。

contentWindow 获取指定的frame 或iframe 的window 对象。

DA TAFLD dataFld 设置或获取由dataSrc 属性指定的绑定到指定对象的给定数据源的字段。

DA TASRC dataSrc 设置或获取用于数据绑定的数据源。

disabled 获取表明用户是否可与该对象交互的值。

END end 设置或获取表明元素结束时间的值，或者元素设置为重复的简单持续终止时间。

firstChild 获取对象的childNodes 集合的第一个子对象的引用。

FRAMEBORDER frameBorder 设置或获取是否显示框架的边框。

hasMedia 获取一个表明元素是否为HTML+TIME 媒体元素的Boolean 值。

HEIGHT height 设置或获取对象的高度。

HIDEFOCUS hideFocus 设置或获取表明对象是否显式标明焦点的值。

HSPACE hspace 设置或获取对象的水平边距。

ID id 获取标识对象的字符串。

1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。

由于此属性内容比较多，我们将到下一章单独对滤镜介绍。

1.Alpha：设置透明度Alpha(Opacity=?, FinishOpacity=?, Style=?, StartX=?, StartY=?, FinishX=?, Finis hY=?)Opacity：透明度级别，范围是0-100，0代表完全透明，100代表完全不透明。

FinishOpac ity：设置渐变的透明效果时，用来指定结束时的透明度，范围也是0 到 100。

Style：设置渐变透明的样式，值为0代表统一形状、1代表线形、2代表放射状、3代表长方形。

StartX和StartY：代表渐变透明效果的开始X和Y坐标。

FinishX和FinishY：代表渐变透明效果结束X和Y 的坐标。

2.BlendTrans：图像之间的淡入和淡出的效果BlendTrans(Duration=?) Duration：淡入或淡出的时间。

注意：这个滤镜必须配合JS建立图片序列，才能做出图片间效果。

3.Blru：建立模糊效果Blur(Add=?, Direction=?, Strength=?) Add：是否单方向模糊，此参数是一个布尔值，t rue（非0）或false（0）。

Direction：设置模糊的方向，其中0度代表垂直向上，然后每45度为一个单位。

Strength：代表模糊的象素值。

4.Chroma：把指定的颜色设置为透明Chroma(Color=?) Color：是指要设置为透明的颜色。

5.DropShadow：建立阴影效果DropShadow(Color=?, OffX=?, OffY=?, Positive=?) Color：指定阴影的颜色。

OffX：指定阴影相对于元素在水平方向偏移量，整数。

OffY：指定阴影相对于元素在垂直方向偏移量，整数。

Positive：是一个布尔值，值为true（非0）时，表示为建立外阴影；为fals e(0)，表示为建立内阴影。

6.FlipH：将元素水平反转7.FlipV：将元素垂直反转8.Glow：建立外发光效效果Glow(Color=?, Strength=?)Color：是指定发光的颜色。

Strength：光的强度，可以是1到255之间的任何整数，数字越大，发光的范围就越大。

9.Gray：去掉图像的色彩，显示为黑白图象10. Invert：反转图象的颜色，产生类似底片的效果11. Light：放置光源的效果，可以用来模拟光源在物体上的投影效果注意：此效果需要用JS设置光的位置和强度。

12. Mask：建立透明遮罩Mask(Color=?) Color：设置底色，让对象遮住底色的部分透明。

13. RevealTrans：建立切换效果RevealTrans(Duration=?, Transition=?)Duration：是切换时间，以秒为单位。

Transtition：是切换方式，可设置为从0到23。

注意：如果做页面间的切换效果，可以在<head>区加上一行代码：<Meta http-equiv=Page -enter content=revealTrans(Transition=?,Duration=?) >。

如果用在页面里的元素必须配合JS使用。

14. Shadow：建立另一种阴影效果 Shadow(Color=?, Direction=?) Color：是指阴影的颜色。