ch6 css.ppt

1、第6章XML和CSS、6.1 CSS简介、6.1.1 CSS基本概念层叠样式表(CSS)是在当前浏览器中以特定格式显示XML文档内容的主要方法之一。CSS样式表包含一组规则，用于设置最初用于控制HTML文档内容显示格式的元素显示样式，还可以用于控制XML文档内容的显示格式。XML和HTML使用的CSS语法徐璐连接，并通过一组特定的属性设置指定元素内容的显示格式。可以设置的元素显示属性包括文本的字体、字体、大小和颜色、元素内容在页面上的位置、是否分段、是否对齐、是否添加边框、背景和下划线。通过创建、特殊样式表文件并放置控制元素显示格式的相关命令，使其与XML文档中的数据内容分离，可以极大地提高控

2、制XML文档显示方式的灵活性，并且使样式表本身易于维护。与可扩展样式表语言(XSL)技术相比，使用CSS技术显示XML文档的方法有限。6.1.2生成和应用CSS，编写1 XML文档，例如，创建书籍中显示的XML示例文档Cha4_1.xml。2建立样式表档案CSS样式表具有副档名，可让您使用文字编辑器(例如记事本)建立CSS样式表档案。是CSS的纯文本文件。例如，指定上述Cha4_1.xml文档的显示格式的show1 .您可以创建名为CSS的简单CSS样式表文件。要将样式表链接到3 XML文档，并引用所创建的样式表文件来设置显示XML文档内容的格式，必须将相应的样式表文件链接到牙齿XML文档。在

3、上面的示例中，Cha4_1.xml文档中6.2 CSS默认语法，1CSS语句的默认格式CSS语句的默认格式为：选择器属性1:属性值1；属性2:属性值2。其中选择器指定应用规则的元素，由一个或多个元素名称或特定标识符组成。后面是用大括号括起来的属性名称对及其属性值。牙齿值用于为选择器指定的元素设置特定的显示样式。注意：大括号内的每个属性名称及其属性值必须用冒号 : 分隔。每个属性对之间有分号“；”必须使用分离。样式表文件还可以包含注释语句。添加注释文字可以使样式表更易于阅读。注释语句以斜线和星号“/*”开头，以星号和斜线“*/”结尾，并且您可以输入要在两个特定标签之间说明的字符。2CSS中的注释

4、，对于IE浏览器，CSS不区分字符的大小写。但是，将CSS应用于XML文档时，忽略字符的大小写可能会导致问题。要使用CSS显示XML文档，必须使文档中各种元素的名称(不只是大小写)完全不同。在3CSS中设置字符的大小写，在4CSS中继承属性，通常在CSS中为元素设置的显示格式属性会影响该元素中包含的所有子元素，除非子元素重置了其他格式属性。5在CSS中使用中文，CSS1牙齿对支持多个字符集不好，改善了CSS2中的牙齿问题。要在CSS中使用简体中文字符集，必须将charset gb2312命令添加到CSS文件的第一行。6.3 CSS属性设置和6.3.1设置显示属性元素的display属性控制浏览

5、器显示该元素文本的默认方式。您可以为Display属性指定以下四个茄子属性值之一：Block将元素标记为块，并通过换行与其他元素分开显示。Inline在同一行上显示元素。List-item以列表形式显示元素。隐藏元素，使元素不显示在“无”页面上。、设置6.3.2字体属性、1font-family属性2font-size属性3font-style属性4font-weight属性5font-variant属性6font属性设置、设置字体属性示例collfont 3360 Normal Small-Caps Bolder 15pt Cambria，Times New Roman，体积，斜体_GB23

6、12，体积，体积Namefont-族群3360斜体font-size :30 pt；Display:block，author font-family:新载波；color : # 7 B7 CFF；Display:blockpublisher color : # 7 B7 b7b:display : block；price font-size :13 pt；Display:block，效果：设置6.3.3颜色属性。与颜色设定相关的属性包括color、background-color、border-color等，color属性在牙齿期间最适用。您可以使用英文颜色名称，或使用RGB格式之一作为颜色属

7、性值。设置6.3.4文本属性，1letter-spacing属性2word-spacing属性3vertical-align属性4text-align属性5text-indent属性6 line-he 6.3.5边框属性txt margin-top :15mm；margin-bottom 336015mm；margin-left :25mm；margin-right 336025mm；XML文件：奥林匹克格言(Olympic Motto)也称为奥林匹克口号。奥林匹克运动有著名的格言：牙齿。更快，更高，更强.牙齿格言是在库佛丹的好友、巴黎阿奎尔修道院院长迪东牙齿他的学生举行的露天运动会上鼓励学生

8、时说的。他说：“在这里，你们的口号更快、更高、更强。”牙齿口号的希腊语是citius，altius，fortius。2005年六月26日在北京工人体育馆举行的发表仪式上，北京奥运会组委会发表了“同一个世界，同一个梦想”。效果：设置6.3.7背景属性，1background-color属性2background-image属性3background-repeat属性4background-position属性5，6.3、6.4 CSS选择器、1元素选择器2通用选择器3CLASS选择器4ID选择器5医生类选择器6层选择器7子选择器8相邻同级选择器9属性选择器、1元素选择器、默认格式：tagname

9、1，tagname2 property 3360 value示例：h1，H2 backsfont-family 3360 arial、verdana、sans-serif；font-weight : bold；H3 font-style : italic；2通配符选择器(*)，将样式像通配符一样添加到页面的所有元素(例如* color:blue/*列出文档中所有元素的color属性为blue的通配符选择器。优先级低*/*/*。p font-weight : bold；适用于所有类为p的元素的/*类选择器是.您可以忽略与p */，3类选择器相对应的(*)符号。默认格式：tagname . cla

10、ss value property 3360 value示例/*类选择器，应用于所有类p元素*/，4ID选择器，默认格式：tagname # idvalue property 3360 value# div . div color : red；/* ID选择器和类选择器的组合可以这样写，*/，5医生类选择器用于为链接的每个状态定义不同的渲染样式。不支持IE6.0部分。默认格式：a : link a : visited a 3360 hover a : active，例如p width:500px/*使用：first-line之前设定元素宽度。如果未指定对象的width属性，则第一行内容的长度取

11、决于窗口宽度。*/p 3360 first-line color 3360 red；/* p元素第一段的文字始终显示为红色，无论是否设置了p宽度*/p : first-letter font-size 33602 em；使用6层次选择器指示一个元素是另一个元素的子节点。示例：timehour display 3360 inlinefont-size :56 pt；color 3360 RGB(0，255，0):7子选择器(IE6.0不支持)，语法：parentchild property 3360 value，8相邻同级选择器(IE6.0不支持)，语法/*匹配具有href特性的所有a零件*/*

12、 title font-weight 3360 bold；/*匹配具有title属性的所有元素*/ahref title color : red；/*与具有title属性和href属性的所有a元素*/、6.5 CSS的链接匹配。6.5.1常规链接命令通常允许在XML文档的开头使用xml-stylesheet处理指令附加指定的CSS样式表。格式如下：其中：XML-stylesheet表示显示当前XML文档时必须使用样式表。Type=text/CSS表示使用CSS类型的样式表。Href=URL用于指定样式表文件的URL。在6.5.2中，import指令可让您在样式表中使用import指令汇入一个或

13、多个独立储存的样式表。也就是说，将该样式表中包含的规则添加到当前样式表中。格式为import url(StyleSheetURL)。其中StyleSheetURL表示要导入的样式表文件的URL，可以是本地或网络上样式表文件的绝对路径或相对路径。注意：牙齿命令必须位于CSS样式表的开头，后跟分号“；”必须牙齿来，不能错过。例如，import URL(show 1 . CSS)；如果XML文档中的某些元素添加了STYLE属性，则浏览器将根据在牙齿STYLE属性中设置的属性值显示这些元素，而不管CSS样式表的设置如何。CSS中的上下文选择器比常规选择器的优先级高。如果没有为子元素设置特定的样式规则，

14、则自动继承父元素的规则。示例：导入URL(out CSS . CSS)；张三南，如果样式表未设定元素的样式规则，且无法继承父元素的样式规则，浏览器将使用您设定的规则。如果同一级别元素的属性指定了冲突的属性值，浏览器将使用上次处理的属性设置。可以使用！Important关键字特别声明牙齿规则是重要和必需的。关于学校概况机构设置教育教育与我们联系的问题，super cars for the super-richome河北师范大学是具有100年历史和光荣传统的省的重点大学。学校起源于1902年在北京成立的顺天部学堂和1906年在天津创建的北洋女士泛学堂。1996年，六月、原河北师范大学、河北师范大学

15、和1952年创建的河北教育学院、1984年创建的河北职业技术师范学院合并，成立了新的河北师范大学。是我国较早成立的目前规模较大的高等师范大学之一。同学中有老一辈革命家邓颖超、刘庆阳、郭隆进、杨秀峰、康斯、永高汤等，学界名人杨小民、张新民、唐勇通等，中科院院士严育光、何柏林等，也有许少发、蔡进化等体育界精英，新中国More，tag _ box width:405px高度：206pxBorder:1px solid # B0BEC7Font :12 px arial，Helvetica，sans-serif；margin 336010 px:overflow : hidden；Display:block.tag _ boxul . menulist Li a color : # 18397 c；text-decoration : none；显示器：线；Width:80pxborder-bottom 33601 px solid # 93a 6 B4；背景： URL(tag _ pipe . gif)no-repeat right 1px；tag _ boxul . menuli stli a . cur menu background 3360 URL(tag _ pipe _ gif)repeat-x；border 33601 px solid # 91a 7 B4；