5XML技术-使用CSS设置XML样式.pptVIP

第五章 使用CSS设置XML样式 1 何为CSS 2 XML如何关联CSS 3 何为CSS选择器 4 何为CSS基本属性 ? ? ? ? CSS 能对XML做什么？ CSS简介 CSS Cascading Style Sheet——层叠样式表 样式 格式，文字的大小、颜色以及图片位置以及段落、列表的形式等 层叠 引用多个CSS样式时，如果CSS的定义发生冲突，浏览器将依据层次的先后顺序来应用样式，如果不考虑样式的优先级时，一般会遵循“最近优选原则” CSS的核心目的 实现网页结构内容和表现形式的分离，将原来由语言所承担的一些与结构无关的功能剥离出来，改由CSS来完成 CSS的思想 CSS的思想 首先指定对什么“对象”进行设置，然后指定对该对象的哪个方面的“属性”进行设置，最后给出该设置的“值”。 CSS规则的构造 对象 属性 值 CSS规则的模式 style type=text/css P {font-size:16px; color:red;} /style p赋于标记符类产生的格式/p span class=“biaoti”类选择器定义的格式/span p id=“bt”赋于标记符id所产生的格式/p style type=text/css #bt {font-size:16px; color:yellow;} /style style type=text/css .biaotit {font-size:16px; color:green;} /style XML如何关联CSS 创建XML文件 为XML文档设计相应的CSS样式表 在XML文档中引用建好的外部CSS样式表 ?xml:stylesheet type=“text/css” href=“CSS的URL? 预处理命令： ? xml:stylesheet ? XML如何关联CSS 何为CSS选择器 样式表规则的组成： 选择符（selector） 决定哪些因素要受到影响 声明（declaration） 一个或多个属性值对组成 基本语法： selector{属性:属性值[[;属性:属性值]…]} 语法说明： selector表示希望进行格式化的元素； 声明部分包括在选择器后的大括号中； 用“属性:属性值”描述要应用的格式化操作； 声明中的多个属性值对之间必须用分号隔开。 何为CSS选择器 选择器（selector） CSS的对象是很重要的，它指定了对哪些网页元素进行设置，因此，它有一个专门的名称——选择器（selector） 类型： 普通选择器 复合选择器 标签 何为CSS选择器 普通选择器——标签选择器 标签 style type=text/css p{font-size:16px; color:red;} /style 何为CSS选择器 普通选择器——类别选择器 style type=text/css .biaoti{font-size:16px; color:red;} /style body p普通文字/p p class=biaoti赋于标记符类所产生的格式/p span class=biaoti类选择器所定义的格式/span /body 何为CSS选择器 普通选择器——ID选择器 style type=text/css #biaoti{font-size:16px; color:red;} /style body p普通文字/p p id=biaoti赋于标记符id所产生的格式/p span id=biaotiID选择器所定义的格式/span /body p{/* 标记选择器 */ color:blue; } p.Special{ color:red; } .special{/* 类别选择器 */ color:green; } /style /head body paaaa/p h3bbbbbbb/h3 p class=specialccccccc（红色）/p h3 class=specialdddddd/h3 /body /html 何为CSS选择器 复合选择器——交集选择器 何为CSS选择器——示例 使用CSS设置XML样式——示例 使用CSS设置XML样式——示例 CSS属性——字体属性 color ——字体颜色 font-size ——字号 font-family ——字体 font-style ——字体样式 normal | italic | oblique(歪斜体) font-weight ——字体加粗 normal | bold | bolder | lighter | 100 | 200 | 300 font-variant