XML

XML 知识量:7 - 28 - 99

5.2 CSS与XML><

CSS基本语法- 5.2.1 -

CSS由一系列用来进行格式设置的指令或规则组成,指令由两部分组成:

  • 选择器。用于指出该规则所适用的XML文档的元素。

  • 样式。用于设置元素显示的具体样式。

CSS语法格式如下:

选择符
{
    属性1:属性值1;
    属性2:属性值2;
    ......
    属性n:属性值n;
}

其中,属性与属性值之间用冒号分隔;各属性间用分号分隔。

CSS常用属性- 5.2.2 -

CSS的常用属性如下:

1、display属性。用于设置元素的显示方式,其取值和含义如下表所示:

display属性说明
block表示块元素,通过换行与其他元素分隔。
inline表示内联元素,元素内容紧挨着前一元素。
list-item以列表方式显示元素
none隐藏元素

2、块样式属性。如果display属性取值为block时,说明元素被设置为块元素,可以对块的外框、框线样式、块与块之间的间隔等进行设置,即块样式属性,具体如下表:

块样式属性说明
border-color框线颜色
border-style框线样式
border-top-width块上方的间隔
border-right-width块右方的间隔
border-bottom-width块下方的间隔
border-left-width块左方的间隔

3、位置的样式属性。用于定义元素显示在指定的位置,具体如下表:

位置的样式属性说明
position定位方式,可取值absolute、relative、static。
left设置与左边界的距离
top设置与顶部的距离
width设置显示宽度
height设置显示高度
z-index设置元素重叠时的显示排序
visibility显示或隐藏元素

4、颜色与背景样式属性。用于设置内容的显示颜色和背景颜色,具体如下表:

颜色与背景样式属性说明
color设置文字内容的颜色
background-color设置背景颜色
background-image设置背景图片
background-position设置背景图片的位置

5、字体样式属性。用于设置字体的样式,具体如下表:

字体样式属性说明
font-family设置要使用的字体
font-weight设置字体的粗细
font-size设置字体的大小
font-style设置字体的样式
font-variant设置字体打印样式

6、文本样式属性。用于设置文本显示的外观,例如:文本的对齐方式、文本下划线等,具体如下表:

文本样式属性说明
line-height设置元素的行距
margin-left设置元素的左边界
margin-right设置元素的右边距
margin-top设置元素的上边距
margin-bottom设置元素的下边距
text-decoration设置文本修饰方式(下划线等)
vertical-align设置文本垂直对齐方式
text-transform设置文本转换(大小写等)
text-align设置文本内容水平对齐方式
text-indent设置文本段落缩进方式
word-spacing设置单词间距
letter-spacing设置字母间距

使用CSS显示XML文档- 5.2.3 -

使用CSS显示XML文档主要分为3个步骤:

  1. 创建XML文档。

  2. 创建CSS样式表。

  3. 将CSS样式表链接到XML文档中,再浏览器中查看XML文档显示效果。

其中,将CSS样式表链接到XML文档时,需要在XML文档声明语句的之后添加关于样式表的声明语句,语法为:

<?xml-stylesheet type="text/css" href="css_uri"?>

以上代码简要说明如下:

  • <?xml-stylesheet ?>是处理指令,指明在解析器解析XML文档时应当使用的样式表。其中,连字符“-”可以替换为冒号“:”,即<?xml:stylesheet ?>

  • type属性用于指定链接样式表文件的格式,如果是CSS样式表,值为text/css;如果是XSL样式表,值为text/xsl。

  • href属性用于指定样式表的路径,可以是绝对路径,也可以是相对路径。