CSS样式表资料.docx
- 文档编号：10460584
- 上传时间：2023-02-13
- 格式：DOCX
- 页数：21
- 大小：25.56KB
CSS样式表资料.docx
《CSS样式表资料.docx》由会员分享，可在线阅读，更多相关《CSS样式表资料.docx（21页珍藏版）》请在冰豆网上搜索。
CSS样式表资料
1.background背景设置
--background:
background-color||background-image||background-repeat||background-attachment||background-position
--默认值为：
transparentnonerepeatscroll0%0%
1.background-attachment设置背景图像是否固定或者随着页面的其余部分滚动
--scroll:
默认值。
背景图像会随着页面其余部分的滚动而移动。
Fixed:
当页面的其余部分滚动时，背景图像不会移动;inherit:
规定应该从父元素继承background-attachment属性的设:
2.background-color背景颜色
--background-color:
transparent|color
--transparent背景色透明;color:
指定颜色
3.background-image
--background-image:
none|url（url）
4.background-position设置背景图像的起始位置（有时图片小，就不能完全填充，可能需要多个图）
--默认值为：
（0%0%）。
--语法:
background-position:
length||length或background-position:
position||position
-length:
百分数|由浮点数字和单位标识符组成的长度值
-position:
top|center|bottom|left|center|right
5.background-repeat设置是否及如何重复背景图像
--background-repeat:
repeat|no-repeat|repeat-x|repeat-y
--repeat:
背景图像在纵向和横向上平铺（默认）;no-repeat:
背景图像不平铺;repeat-x:
背景图像在横向上平铺;repeat-y:
背景图像在纵向平铺
6.border边框设置
--简写属性在一个声明设置所有的边框属性,可按照border-width,border-style,border-color
--border:
5pxsolidred;
7.border-bottom简写属性把下边框的所有属性设置到一个声明中border-bottom-width,border-bottom-style,border-bottom-color
8.border-bottom-color下边框的颜色
--color_name规定颜色值为颜色名称的颜色（比如red）;hex_number规定颜色值为十六进制值的颜色（比如#ff0000）;rgb_number规定颜色值为rgb代码的颜色（比如rgb（255,0,0））inherit规定应该从父元素继承颜色。
9.border-bottom-style设置元素下边框的样式,只有当这个值不是none时边框才可能出现。
--none:
定义无边框;hidden:
与"none"相同。
不过应用于表时除外，对于表，hidden用于解决边框冲突;dotted:
定义点状边框。
在大多数浏览器中呈现为实线。
Dashed;定义虚线。
在大多数浏览器中呈现为实线;solid:
定义实线。
Double:
定义双线。
双线的宽度等于border-width的值;groove:
定义3D凹槽边框。
其效果取决于border-color的值;ridge:
定义3D垄状边框。
其效果取决于border-color的值;inset:
定义3Dinset边框。
其效果取决于border-color的值;outset:
定义3Doutset边框。
其效果取决于border-color的值;inherit:
规定应该从父元素继承边框样式
10.border-bottom-width设置元素的下边框的宽度。
--thin:
定义细的下边框;medium:
默认值。
定义中等的下边框;thick;定义粗的下边框。
Length:
允许您自定义下边框的宽度;inherit:
规定应该从父元素继承边框宽度
11.border-collapse设置表格的边框是否被合并为一个单一的边框
--separate:
默认值。
边框会被分开。
不会忽略border-spacing和empty-cells属性
--collapse:
如果可能，边框会合并为一个单一的边框。
会忽略border-spacing和empty-cells属性
--inherit;规定应该从父元素继承border-collapse属性的值。
12.border-color属性用于设置元素所有边框的颜色，或者单独地为各边设置边框颜色
--格式同border-width
13.border-left简写属性把左边框的所有属性设置到一个声明中,border-left-width,border-left-style,border-left-color
14.border-left-color设置元素左边框的颜色.见border-bottom-width
15.border-left-style设置元素左边框的样式。
见border-bottom-width
16.border-left-width属性设置元素的左边框的宽度,见border-bottom-width
17.border-right简写属性把右边框的所有属性设置到一个声明,
18.border-right-color设置元素左边框的颜色
19.border-right-style设置元素左边框的样式
20.border-right-width属性设置元素的左边框的宽度
21.border-spacing属性设置相邻单元格的边框间的距离（仅用于“边框分离”模式）
--在指定的两个长度值中，第一个是水平间隔，第二个是垂直间隔。
除非border-collapse被设置为separate，否则将忽略这个属性
22.border-style属性用于设置元素所有边框的样式，或者单独地为各边设置边框样式
--同border-width的格式
23.border-top简写属性把下边框的所有属性设置到一个声明,
24.border-top-color设置元素左边框的颜色
25.border-top-style设置元素左边框的样式
26.border-top-width属性设置元素的左边框的宽度
27.border-width边框宽度
--medium默认。
定义中等的边框。
;thin定义细的边框。
;thick定义粗的边框;inherit规定应该从父元素继承边框宽度;length允许您自定义边框的宽度。
--border-width:
thinmediumthick10px;上边框是细边框,右边框是中等边框,下边框是粗边框,左边框是10px宽的边框
--border-width:
thinmediumthick;上边框是10px,右边框和左边框是中等边框,下边框是粗边框
--border-width:
thinmedium;上边框和下边框是细边框,右边框和左边框是中等边框
--border-width:
thin;所有4个边框都是细边框
28.bottom规定元素的底部边缘。
该属性定义了定位元素下外边距边界与其包含块下边界之间的偏移
--auto:
默认值。
通过浏览器计算底部的位置;%:
设置以包含元素的百分比计的底边位置。
可使用负值;length:
使用px、cm等单位设置元素的底边位置。
可使用负值;inherit:
规定应该从父元素继承bottom属性的值
29.caption-side属性设置表格标题的位置
30.clear清除浮动.left为禁止左侧浮动，如果左侧有浮动元素，则自己会换一行显示;right,both,none属性如同
31.clip:
属性剪裁绝对定位元素。
当一幅图像的尺寸大于包含它的元素时会发生什么呢？
"clip"属性允许您规定一个元素的可见尺寸，这样此元素就会被修剪并显示为这个形状。
⏹shape设置元素的形状。
唯一合法的形状值是：
rect（top,right,bottom,left）
⏹--auto:
默认值。
不应用任何剪裁。
⏹Inherit:
32.color设置了一个元素的前景色（在HTML表现中，就是元素文本的颜色
--color_name规定颜色值为颜色名称的颜色（比如red）;hex_number规定颜色值为十六进制值的颜色（比如#ff0000）;rgb_number规定颜色值为rgb代码的颜色（比如rgb（255,0,0））inherit规定应该从父元素继承颜色。
--如color:
red;color:
#00ff00;color:
rgb（0,0,255）
33.content:
content属性与:
befor及:
after伪元素配合使用，来插入生成内容
34.counter-increment:
counter-increment属性设置某个选取器每次出现的计数器增量。
默认增量是1
35.counter-reset:
counter-reset属性设置某个选择器出现次数的计数器的值。
默认为0
36.cue:
设置在对象前后播放的声音。
37.cue-after:
cue-after:
none|url（url）;none为默认值。
无声音播放,url（url使用绝对或相对url地址指定音乐文件）
38.cue-before:
同上
39.cursor:
属性规定要显示的光标的类型（形状）。
值
描述
url
需使用的自定义光标的URL。
注释：
请在此列表的末端始终定义一种普通的光标，以防没有由URL定义的可用光标。
default
默认光标（通常是一个箭头）
auto
默认。
浏览器设置的光标。
crosshair
光标呈现为十字线。
pointer
光标呈现为指示链接的指针（一只手）
move
此光标指示某对象可被移动。
e-resize
此光标指示矩形框的边缘可被向右（东）移动。
ne-resize
此光标指示矩形框的边缘可被向上及向右移动（北/东）。
nw-resize
此光标指示矩形框的边缘可被向上及向左移动（北/西）。
n-resize
此光标指示矩形框的边缘可被向上（北）移动。
se-resize
此光标指示矩形框的边缘可被向下及向右移动（南/东）。
sw-resize
此光标指示矩形框的边缘可被向下及向左移动（南/西）。
s-resize
此光标指示矩形框的边缘可被向下移动（北/西）。
w-resize
此光标指示矩形框的边缘可被向左移动（西）。
text
此光标指示文本。
wait
此光标指示程序正忙（通常是一只表或沙漏）。
help
此光标指示可用的帮助（通常是一个问号或一个气球）。
40.direction属性规定文本的方向/书写方向。
值
描述
ltr
默认。
文本方向从左到右。
rtl
文本方向从右到左。
inherit
规定应该从父元素继承direction属性的值。
41.display定义元素的显示效果
none
此元素不会被显示。
block
此元素将显示为块级元素，此元素前后会带有换行符。
inline
默认。
此元素会被显示为行内元素，元素前后没有换行符。
inline-block
行内块元素。
（CSS2.1新增的值）
list-item
此元素会作为列表显示。
run-in
此元素会根据上下文作为块级元素或内联元素显示。
compact
CSS中有值compact，不过由于缺乏广泛支持，已经从CSS2.1中删除。
marker
CSS中有值marker，不过由于缺乏广泛支持，已经从CSS2.1中删除。
table
此元素会作为块级表格来显示（类似
| 和 | ） table-caption 此元素会作为一个表格标题显示（类似 inherit 规定应该从父元素继承display属性的值。 42.elevation empty-cells设置是否显示表格中的空单元格（仅用于“分离边框”模式）。 该属性定义了不包含任何内容的表单元格如何表示。 如果显示，就会绘制出单元格的边框和背景。 除非border-collapse设置为separate，否则将忽略这个属性。 值 描述 hide 默认。 不在空单元格周围绘制边框。 show 在空单元格周围绘制边框。 inherit 规定应该从父元素继承empty-cells属性的值。 43.filter 语法： STYLE="filter: filtername（fparameter1,fparameter2...）" （Filtername为滤镜的名称，fparameter1、fparameter2等是滤镜的参数） 滤镜说明： Alpha： 设置透明层次 blur： 创建高速度移动效果，即模糊效果 Chroma： 制作专用颜色透明 DropShadow： 创建对象的固定影子 FlipH： 创建水平镜像图片 FlipV： 创建垂直镜像图片 glow： 加光辉在附近对象的边外 gray： 把图片灰度化 invert： 反色 light： 创建光源在对象上 mask： 创建透明掩膜在对象上 shadow： 创建偏移固定影子 wave： 波纹效果 Xray： 使对象变得像被x光照射一样 1、滤镜： Alpha 语法： STYLE="filter: Alpha（Opacity=opacity,FinishOpacity=finishopacity，Style=style,StartX=startX，StartY=startY，FinishX=finishX，FinishY=finishY）" 说明： Opacity： 起始值，取值为0～100,0为透明，100为原图。 FinishOpacity： 目标值。 Style： 1或2或3 StartX： 任意值 StartY： 任意值 例子： filter: Alpha（Opacity="0",FinishOpacity="75",Style="2"） 2、滤镜： blur 语法： STYLE="filter: Blur（Add=add,Direction=direction,Strength=strength）" 说明： Add： 一般为1，或0。 Direction： 角度，0～315度，步长为45度。 Strength： 效果增长的数值，一般5即可。 例子： filter: Blur（Add="1",Direction="45",Strength="5"） 3、滤镜： Chroma 语法： STYLE="filter: Chroma（Color=color）" 说明： color： #rrggbb格式，任意。 例子： filter: Chroma（Color="#FFFFFF"） 4、滤镜： DropShadow 语法： STYLE="filter: DropShadow（Color=color,OffX=offX,OffY=offY,Positive=positive）" 说明： Color: #rrggbb格式，任意。 Offx： X轴偏离值。 Offy： Y轴偏离值。 Positive： 1或0。 例子： filter: DropShadow（Color="#6699CC",OffX="5",OffY="5",Positive="1"） 5、滤镜： FlipH 语法： STYLE="filter: FlipH" 例子： filter: FlipH 6、滤镜： FlipV 语法： STYLE="filter: FlipV" 例子： filter: FlipV 7、滤镜： glow 语法： STYLE="filter: Glow（Color=color,Strength=strength）" 说明： Color： 发光颜色。 Strength： 强度（0－100） 例子： filter: Glow（Color="#6699CC",Strength="5"） 8、滤镜： gray 语法： STYLE="filter: Gray" 例子： filter: Gray 9、滤镜： invert 语法： STYLE="filter: Invert" 例子： filter: Invert 10、滤镜： mask 语法： STYLE="filter: Mask（Color=color）" 例子： filter: Mask（Color="#FFFFE0"） 11、滤镜： shadow 语法： filter: Shadow（Color=color,Direction=direction） 说明： Color： #rrggbb格式。 Direction： 角度，0－315度，步长为45度。 例子： filter: Shadow（Color="#6699CC",Direction="135"） 12、滤镜： wave 语法： filter: Wave（Add=add，Freq=freq，LightStrength=strength，Phase=phase，Strength=strength） 说明： Add： 一般为1，或0。 Freq： 变形值。 LightStrength： 变形百分比。 Phase： 角度变形百分比。 Strength： 变形强度。 例子： filter: wave（Add="0",Phase="4",Freq="5",LightStrength="5",Strength="2"） 13、滤镜： Xray 语法： STYLE="filter: Xray" 例子： filter: Xray 14.颜色变化 语法： filter: progid: DXImageTransform.Microsoft.Gradient（GradientType=0,StartColorStr='#B5CCFA', EndColorStr='#B5CCFA'）; 43.float left 元素向左浮动。 right 元素向右浮动。 none 默认值。 元素不浮动，并会显示在其在文本中出现的位置。 inherit 规定应该从父元素继承float属性的值。 44.font： 规定文本的字体、字体尺寸、字体颜色。 Font（font-style,font-variant,font-weight,font-size,font-family） 45.font-family使用什么字体 46.font-size字体的大小（） 47.font-size-adjust 48.font-stretch 49.font-style字体的 50.font-variant 51.font-weight字体的粗细 52.height 53.left 54.letter-spacing属性增加或减少字符间的空白（字符间距）。 normal 默认。 规定字符间没有额外的空间。 length 定义字符间的固定空间（允许使用负值）。 inherit 规定应该从父元素继承letter-spacing属性的值。 55.line-height设置行间的距离（行高）。 --normal: 默认。 设置合理的行间距。 Number: 设置数字，此数字会与当前的字体尺寸相乘来设置行间距。 Length: 设置固定的行间距。 %基于当前字体尺寸的百分比行间距。 Inherit: 规定应该从父元素继承line-height属性的值。 56.list-style简写属性在一个声明中设置所有的列表属性。 --可以按顺序设置如下属性： ∙list-style-type ∙list-style-position ∙list-style-image 57.list-style-type 值 描述 none 无标记。 disc 默认。 标记是实心圆。 circle 标记是空心圆。 square 标记是实心方块。 decimal 标记是数字。 decimal-leading-zero 0开头的数字标记。 （01,02,03,等。 ） lower-roman 小写罗马数字（i,ii,iii,iv,v,等。 ） upper-roman 大写罗马数字（I,II,III,IV,V,等。 ） lower-alpha 小写英文字母Themarkerislower-alpha（a,b,c,d,e,等。 ） upper-alpha 大写英文字母Themarkerisupper-alpha（A,B,C,D,E,等。 ） lower-greek 小写希腊字母（alpha,beta,gamma,等。 ） lower-latin 小写拉丁字母（a,b,c,d,e,等。 ） upper-latin 大写拉丁字母（A,B,C,D,E,等。 ） hebrew 传统的希伯来编号方式 armenian 传统的亚美尼亚编号方式 georgian 传统的乔治亚编号方式（an,ban,gan,等。 ） cjk-ideographic 简单的表意数字 hiragana 标记是： a,i,u,e,
冰豆网所有资源均是用户自行上传分享，仅供网友学习交流，未经上传用户书面授权，请勿作他用。
该用户的其他资源 更多>>
猜你喜欢
关于本文
相关资源
更多
copyright@ 2008-2022 冰点文档网站版权所有 经营许可证编号:鄂ICP备2022015515号-1 |
|---|
《Java程序设计》考试大纲及样题试行.docx
