1.overflow内容溢出时的设置(设定被设定对象是否显示滚动条)
overflow-x水平方向内容溢出时的设置
overflow-y垂直方向内容溢出时的设置
以上三个属性设置的值为visible(默认值)、scroll、hidden、auto。
2.scrollbar-3d-light-color立体滚动条亮边的颜色(设置滚动条的颜色)
scrollbar-arrow-color上下按钮上三角箭头的颜色
scrollbar-base-color滚动条的基本颜色
scrollbar-dark-shadow-color立体滚动条强阴影的颜色
scrollbar-face-color立体滚动条凸出部分的颜色
scrollbar-highlight-color滚动条空白部分的颜色
scrollbar-shadow-color立体滚动条阴影的颜色
我们通过几个实例来讲解上述的样式属性:
1.让浏览器窗口永远都不出现滚动条
没有水平滚动条
<body style="overflow-x:hidden">
没有垂直滚动条
注意:括号内为各种可选属性.
类型:type
字体:font-family
大小:font-size
样式:font-style:(italic,normal,oblique(偏斜体))
粗细:font-weight:(bold粗体,normal正常,bolder特粗,lighter特细 ,100-900)
变量:font-variant:(normal正常,small-caps小型大写字母)
行高:line-height:(20px,...)
大小写:text-transform:(capitalize首字母大写,uppercase大写,lowercase小写,none无)
修饰:text-decoration:(underline下划线,overline上划线,line-through删除线,blink闪烁,none无)
颜色:color:(#0000cc,red,...)
背景:backdrop
背景颜色:background-color:(#fff)
背景图像:background-image:(url(mypicture.jpg))<!--这里用的是相对于文档,在都用这个的哦-->
重复:background-repeat:(no-repeat不重复,repeat重复,repeat-x 横向重复,repeat-y纵向重复)
附件:background-attachment:(fixed固定,scroll滚动)
水平位置与垂直位置:background-position:(center水平居中,center垂直居中或20px水平20px,20px垂直20px)
区块:block
单词间距:word-spacing:( 20px;normal)
字母间距:letter-spacing: (1px;normal)
垂直对齐:vertical-align:(baseline将元素的基准线和母体元素的基准线对齐,sub将元素以下标的形式显示,super将元素以上标的形式显示,top将元素顶部同最高的母体元素对齐,text-top将元素的顶部同母体元素文字的顶部对齐,middle将元素的底部同最低的母体元素对齐,text-bottom将元素底部同母体元素文字的底部对齐.)
文本对齐:text-align:(left,center,right,justify)
文字缩进:text-indent:(20pt,20%,20px,2em....)
空格:white-space:(pre保留,normal,nowrap不换行)
方框:casing
宽:(auto,20px)
高:height:(auto,1em)
浮动:float:(left,right,none)
清除:clear:(both,left,right,none)
填充:padding-top:(2px),padding-right:(2px),padding-bottom:(2px),padding-left:(2px)
边框:frame
border-top,border-right,border-bottom,border-left
样式:(none无,dotted点划线,dashed虚线,solid实线,double双线,groove槽状,ridge脊状,inset凹陷,outset凸出)
宽度:(thin细,medium中,thick粗,10px像素)
颜色:(#999999)
列表:list
类型:list-style-type:(disc圆点,circle圆圈,square方块,decimal数字,lower-roman小写罗马数字,upper-roman大写罗马数字,lower-alpha小写字母,upper-alpha大写字母,none无)
项目符号图像:list-style-image:(url(mypic.gif))
位置:list-style-position:(outside外部,inside内部)
定位:place
类型:position:(relative相对,static表态,absolute绝对)
显示:visibility:(visible可见,inherit继承,hidden隐藏)
宽:200px
高:height:100px
Z轴:z-index:2(重叠层次)
溢出:overflow:(hidden,visible,scroll,auto)
定位:top:(20px)
right
left
bottom
剪辑:clip:(rect(auto上自动,20px右,20px下,10px左)
扩展:exhibit
分页之前:page-break-before:(always总是,left,right,auto)
分页之后:page-break-after:(同上)
视觉效果:(光标:wait)
过滤器:alpha透明的渐变效果
BlendTrans混合渐变过滤器
Blur风吹模糊效果
Chroma特定颜色的透明效果
DropShadow阴影效果
FlipH水平翻转效果
FlipV垂直翻转效果
Glow边缘光晕效果
Gray黑白效果
Inzert图片产生底片效果
Light加入光源投射效果
Mask遮蔽效果
RezealTrans显示渐变过滤器
Shadow渐长阴影效果
Waze加入波形效果
Xray加入轮郭效果