XML与CSS
样式表的格式如下:
样式表名称
{ 样式表规则}
为了让XML使用层叠样式表,XML文件必须使用操作指令:
1、 标记与样式表
1.1标记的名称与样式表的名称
对于XML文件,样式表中的“样式表名称”可以是标记的名称,也可以是标记的,名称与该标记的ID属性的值用#连接起来的字符串。
如果有多个标记的内容需要用完全一样的外观来显示,“样式表名称”可以使这些标记的名称用逗号分隔的字符串。
2、 设置文本的显示方式
2.1块方式
在样式表的样式规则中通过将属性display的值指定为block,使得文本在浏览器的一个块区域中显示。
2.2行方式
在样式表中的样式规则中通过将属性display的值指定为line,使得文本以行的方式在浏览器中显示。
2.3按列表方式
在样式表的杨思规则中通过将属性display的值指定为list-item,使得文本按列方式在浏览器中显示。
和list-item属性有关的属性是list-style-type, list-style-type属性可取如下的值:
l disc 圆盘
l circle 圆圈
l square 方块
l decimal 十进制数
l lower-roman 小写罗马数字
l upper-roman 大写罗马数字
l lower-alpha 大写英文数字
l upper-alpha 大写英文数字
2.4不显示
在样式表的样式规则中通过将属性display的值指定为none,以达到不显示标记中文本的目的。
3、 字体
3.1 font-family属性
该属性的值是浏览器支持的字体名称,该属性的默认值是浏览器确定的默认字体名称。
3.2font-style属性
该属性的值指定字体是否使用斜体,默认值是normal,该属性是可以是normal或italic。
3.3font-variant属性
该属性的值用来指定是否使用小体的大写字母来显示文字,默认值是normal。该属性能取的属性值是normal(正常大写字母)和small-caps(小体大写字母)
3.4font-weight属性
该属性的值用来设置字体线条的粗细,默认值是normal。该属性能取值的属性值为:
normal(400),bold(700),bolder(500),lighter(700),100,200,300,400,500,600,700,800,900
3.5font-size属性
该属性的值用来设置字体的大小,单位为pt(镑)
4、 文本样式
4.1 text-align
该属性的值用来设置文本的对其方式,其默认值是left。该属性能取的值如下:
left(左对齐),right(右对齐),center(居中对齐),justify(两端对齐)
4.2 text-indent属性
该属性的值用来设置文本首行的缩进量,单位是像素(px)或镑(pt),默认值是0。
4.3 text-transform属性
该属性的值是用来设置是否经文本中的字母全部大写,全部小写或者首字母大写,默认值是none。该属性能取的属性值如下:uppercase,lowercase,capitalize,none
4.4 text-decoration属性
该属性的值用来设置是否将文本加下划线,默认值是none,该属性能取的值如下:none,underline,overline,line-through,blink
4.5 vertical-align属性
该属性的值用来设置文本的对其方式,默认值是middle,该属性能取的属性值如下:
Baseline,sub,super,top,text-top,middle,bottom,text-bottom
4.6 line-height属性
该属性的值用来设置文本的行距,默认值是1,该属性的取值是正数。
5、 边框
5.1boder-style属性
该属性的默认值是none,即文本默认没有边框。该属性可取的值有:
dotted 边框线是点组成的虚线
dashed 边框线是短线组成的虚线
double 边框是双线
groove 3D沟槽状边框
ridge 3D脊状的边框
inset 3D内嵌边框
outset 3D外嵌边框
solid 普通的边框
5.2 boder-right-width属性
boder-top –width ,boder-bottom-width ,boder-right-width ,boder-left-width等属性用来设置边框的上边、底边、右边和左边的宽度,这些属性的默认值都是1。
5.3 boder-right-style属性
boder-right–style,boder-left -style,boder-bottom-style,boder-top -style等属性用来单独设置边框的右边、左边、底边和上边的样式。
5.4 boder-right-color
boder-right–color,boder-left -color,boder-bottom-color,boder-top –color等属性用来设置边框的颜色,这些属性的默认值是灰色。
6、 边缘
和边缘有关的属性有margin-top ,margin-right,margin-bottom,margin-left分别为上边缘,右边缘,下边缘,左边缘,单位是像素(px)。
7、 颜色和背景颜色
如果需要设置文本的字符颜色和背景颜色,就可以使用属性color和background-color。
8、 显示图像
可以通过设置background-image属性的值为文本指定一幅背景图像,该属性的取值形式为:URL(“文件名字”)。
另外,还可以通过background-repeat属性设置图像是否通过重复出现来平铺背景,其取值如下:repeat,repeat-x,repeat-y,no-repeat。
9、 设置鼠标的形状
如果希望控制鼠标指针运动到文字的显示区域上面时的形状,就可以使用cursor属性,其可取的值有:auto, crosshair ,default,move, hand, e-resize, ne-resize ,n-resize, nw-resize ,se-resize, sw-resize ,s-resize, w-resize , text ,wait ,help
10、处理层叠
在样式表中设置z-index属性的值来规定一个样式表所在的层,它的属性值是正整数,称为样式表的层数。