网页设计与制作项目式教程教学作者凌云魏慧主编周丽韫吕俊霞田英副主编附录附录B课件

上传人:E**** 文档编号:91175707 上传时间:2019-06-26 格式:PPT 页数:23 大小:90.50KB
返回 下载 相关 举报
网页设计与制作项目式教程教学作者凌云魏慧主编周丽韫吕俊霞田英副主编附录附录B课件_第1页
第1页 / 共23页
网页设计与制作项目式教程教学作者凌云魏慧主编周丽韫吕俊霞田英副主编附录附录B课件_第2页
第2页 / 共23页
网页设计与制作项目式教程教学作者凌云魏慧主编周丽韫吕俊霞田英副主编附录附录B课件_第3页
第3页 / 共23页
网页设计与制作项目式教程教学作者凌云魏慧主编周丽韫吕俊霞田英副主编附录附录B课件_第4页
第4页 / 共23页
网页设计与制作项目式教程教学作者凌云魏慧主编周丽韫吕俊霞田英副主编附录附录B课件_第5页
第5页 / 共23页
点击查看更多>>
资源描述

《网页设计与制作项目式教程教学作者凌云魏慧主编周丽韫吕俊霞田英副主编附录附录B课件》由会员分享,可在线阅读,更多相关《网页设计与制作项目式教程教学作者凌云魏慧主编周丽韫吕俊霞田英副主编附录附录B课件(23页珍藏版)》请在金锄头文库上搜索。

1、附录B,CSS样式属性,1字体属性(font) font-family:设置文本的字体系列。 font-style:设置文本的字体样式,可取值包括normal、italic和oblique。 font-variant:设置文本字体大小写,可取值包括normal、small-caps。 font-weight:设置字体的粗细,可取值包括normal、bold、bolder和lithter font-size:设置文本的字体尺寸,可取值包括absolute-size、relative-size、length和percentage。 font-stretch:设置收缩或拉伸当前的字体系列。,2背景属

2、性(backgroud) background-color:设置元素的背景色。 background-image:设置元素的背景图片。 background-repeat:设置背景图案重复方式,可取值包括repeat-x、repeat-y或no-repeat background-attachment:设置背景图像是否固定或者随着页面的其余部分滚动,可取值包括scroll(滚动)和fixe(固定的)。 background-position:设置背景图片的初始位置,可取值包括percentage、length、top、left、right和bottom。,3文本属性:(text) color:

3、设置文本的颜色。 Direction:设置文本的方向或书写方向。 定义间距: word-spacing:设置单词之间的距离。 letter-spacing:设置字母之间的距离。 text-decoration:设置添加到文本的装饰,可取值包括none、underline、overline、line-through和blink。 vertical-align:设置元素在垂直方向的对齐方式,可取值包括baseline(基线)、sub、super、top、text-top、middle、bottom和text-bottom。,text-transform:控制文本的大小写,可取值包括capitali

4、ze(大写)、uppercase(首字母大写)、lowercase(小写)和none。 text-align设置文本的对齐方式,可取值包括left、right、center和justify。 text-indent:设置文本块的首行缩进,可取值包括length和percentage。 line-height:设置文本的行高,可取值包括normal、numbet、lenggth和percentage(百分比)。,定义超链接: a:link:设置未访问的链接样式。 a:visited:设置已被访问的链接样式。 a:hover:设置鼠标被激活的链接样式。,4块属性(block) 边距属性: marg

5、in-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:设置元素下边框的宽度。

6、 border-left-width:设置元素左边框的宽度。 border-width:设置元素四条边框的宽度。 border-color:设置元素四条边框的颜色。 border-style:设置元素四条边框的样式。,border-top:设置所有的上边框属性。 border-right:设置所有的右边框属性。 border-bottom:设置所有的下边框属性。 border-left:设置所有的左边框属性。 outline:设置所有的轮廓属性。 outline-color:设置轮廓的颜色。 outline-style:设置轮廓的样式。 outline-width:设置轮廓的宽度。,6CSS

7、定位属性(Positioning) bottom:设置定位元素下外边距边界与其包含块下边界之间的偏移。 clear:规定元素的哪一侧不允许其他浮动元素。 clip:设置如果层的内容超出了层的大小时如何处理。有四种处理方式:visible,增加层的大小,从而将层的所有内容显示出来;hidden,保持层的大小不变,将超出层的内容剪裁掉;Scroll,总是显示滚动;Auto,只有在内容超出层的边界时才显示滚动条。 cursor:设置要显示的光标的类型(形状)。 display:设置元素应该生成的框的类型。,float:设置框是否应该浮动。 left:设置定位元素左外边距边界与其包含块左边界之间的偏移

8、。 overflow:设置当内容溢出元素区的内容会如何处理。可取值包括visible、hidden、scroll、auto、inherit。 position:设置元素的定位类型。可取值包括Absolute(绝对定位)、Relative(相对定位)、Static(无特殊定位)。 right:设置定位元素右外边距边界与其包含块右边界之间的偏移。,top:设置定位元素的上外边距边界与其包含块上边界之间的偏移。 vertical-align:设置元素的垂直对齐方式。 visibility:设置对象定位层的最初显示状态。可取值包括Inherit(继承父层的显示属性)、Visible(对象可视)和Hid

9、den隐藏对象。 z-index:设置对象的层叠顺序。编号较大的层会显示在编号较小的层上边。变量值可以是正值也可以是负值。,7列表属性(list) list-style-type:设置列表项标记的类型。可取值包括disc(圆点)、circle(圈)、square(方形)、decimal(阿拉伯数字)、lower-roman(小写罗马数字)、upper-roman(大写罗马数字)、lower-alpha(小写英文字母)、upper-alpha(大写英文字母)和nore。 list-style-image:设置用图片表示列表项标记。可取值包括和none。 list-style-position:设

10、置列表项标记的放置位置。可取值包括inside、outside和inherit。 list-style:设置所有的列表属性。,8尺寸属性(Dimension) height:设置元素高度。 max-height:设设置元素的最大宽度。 max-width:设置元素的最大高度。 min-height:设置元素的最小高度。 min-width:设置元素的最小宽度。 width:设置元素的宽度。,9扩展(Extensions) Pagebreak:设置在打印的时候强迫在样式控制的对象前后换页。 Before:设置对象前出现的页分割符。 Cursor:设置当鼠标滑过样式控制的对象时要改变的鼠标形状。可

11、取值包括hand(手型)、crosshair(“十”型)、text (“I”型)、wait(等待)、default(默认)、help(帮助)、e-resize(东箭头)、ne-resize(东北箭头)、n-resize(北箭头)、nw-resize(西北箭头)、w-resize(西箭头)、sw-resize(西南箭头)、s-resize(南箭头)、se-resize(东南箭头)和auto(自动)。,CSS滤镜属性 Filter:在样式中加上滤镜特效。 1)Alpha:设置透明度。 Alpha(Opacity=?, FinishOpacity=?, Style=?, StartX=?, Star

12、tY=?, FinishX=?, FinishY=?) Opacity:设置透明度的级别,范围是0-100,0代表完全透明,100代表完全不透明。FinishOpacity:设置渐变的透明效果时,用来指定结束时的透明度,范围也是0 到 100。Style:设置渐变透明的样式,值为0代表统一形状、1代表线形、2代表放射状、3代表长方形。StartX和StartY:代表渐变透明效果的开始X和Y坐标。 FinishX和FinishY:代表渐变透明效果结束X和Y 的坐标。,2)BlendTrans:设置图像之间的淡入和淡出的效果。 BlendTrans(Duration=?) Duration:淡入或

13、淡出的时间。 3)Blur:设置模糊效果 Blur(Add=?, Direction=?, Strength=?) Add:设置是否单方向模糊,此参数是一个布尔值,true(非0)或false(0)。 Direction:设置模糊的方向,其中0度代表垂直向上,然后每45度为一个单位。 Strength:模糊的象素值。,4)Chroma:将指定的颜色设置为透明 Chroma(Color=?) Color:指定要设置为透明的颜色。 5)DropShadow:设置阴影效果 DropShadow(Color=?, OffX=?, OffY=?, Positive=?) Color:设置阴影的颜色。 O

14、ffX:设置阴影相对于元素在水平方向偏移量,整数。 OffY:设置阴影相对于元素在垂直方向偏移量,整数。 Positive:是一个布尔值,值为true(非0)时,表示为建立外阴影;为false(0),表示为建立内阴影。,6)FlipH:将元素水平反转。 7)FlipV:将元素垂直反转。 8)Glow:设置外发光效果。 Glow(Color=?, Strength=?) Color:是指定发光的颜色。 Strength:光的强度,可以是1到255之间的任何整数,数字越大,发光的范围就越大。 9)Gray:设置灰度图。即去掉图像的色彩,显示为黑白图象。 10)Invert:设置反转图象,产生类似底

15、片的效果。,11)Light:设置光源的效果,可以用来模拟光源在物体上的投影效果。 12)Mask:设置透明遮罩。 Mask(Color=?) Color:设置底色,让对象遮住底色的部分透明。 13)RevealTrans:设置切换效果。 RevealTrans(Duration=?, Transition=?) Duration:切换时间,以秒为单位。 Transtition:切换方式,可设置为从0到23。 注意:如果做页面间的切换效果,可以在区加上一行代码:。,14)Shadow:设置另一种阴影效果。 Shadow(Color=?, Direction=?) Color:是指阴影的颜色。 Direction:是设置投影的方向,0度代表垂直向上,然后每45度为一个单位。,15)Wave:设置波纹效果。 Wave(Add=?, Freq=?, LightStrength=?, Phase=?, Strength=?) Add:表示是否显示原对象,0表示不显示,非0表示要显示原对象。 Freq:设置波动的个数。 LightStrength:设置波浪效果的光照强度,从0到100,0表示最弱,100表示最强。 Phase:波浪的起始相角。从0到100的百分数值。 Strength:设置波浪摇摆的幅度。 16)Xray:设置显现图片的轮廓,具有X光片效果,

展开阅读全文
相关资源
相关搜索

当前位置:首页 > 高等教育 > 大学课件

电脑版 |金锄头文库版权所有
经营许可证:蜀ICP备13022795号 | 川公网安备 51140202000112号