层次样式表.pptx
《层次样式表.pptx》由会员分享,可在线阅读,更多相关《层次样式表.pptx(41页珍藏版)》请在咨信网上搜索。
1、1应用系统开发导论层次样式表(CSS)2内容内容CCS基础XHTML和CSS结合的方式CSS的高级语法CSS的特性举例小结3层次样式表的起源和优点层次样式表的起源和优点 在最初版本的HTML中并不提供任何样式控制能力,它只是标明文档成分的功能,1995年晚期,W3C提出了CSS作为所有这些问题的解决方案。Cascading Styles Sheet 1996年提出了第一个版本,也是目前主流支持的规范 1998年提出了第二个版本,可以实现XML的转换和样式化,增加了特定媒体的风格单 CSS3便于对文档样式进行修改、便于维护多个文档以统一的样式、使HTML文档更简洁,更易于维护、使文档可以方便运行
2、于不同媒体设备上等 4层次样式表基本语法 还可以添加注释文本,注释文本须放置在/*和*/之间。p font-size:12pt;font-style:italic;color:greenSelectorProperty list separated by semicolonsPropertyProperty valueColon5XHTML与样式表结合的三种方法与样式表结合的三种方法 外部式样式表(External style sheet,又称链接样式表)内嵌式样式表(Embedded style sheet)行内样式表(Inline style,又称内联样式表)6外部式样式表外部式样式表外部
3、样式表合适作为文档模板,同时供一系列XHTML文档共用。使用外部式样式表时,我们将样式表保存在一个后缀名为.css的单独文本文件中/*This is the style sheet to be linked*/p color:red;h1color:green;7XHMTL代码代码example for external cssThis is H1 elementLets see the effective of css8内嵌式样式表内嵌式样式表只是一个页面使用style需要将样式表放置与head元素的style子元素中。此时需将style元素的type元素设置为“text/css”9exam
4、ple for embeded cssThis is H1 elementLets see the effective of css 10行内样式表行内样式表 行内样式表可用于将某个具体的元素定义为一个与其他不同的样式,但是由于其损害了样式表的优点,所以一般不推荐使用。行内样式表将样式表内容作为XHTML元素的通用属性style的属性值。This is H1 element11example for inline cssThis is H1 elementLets see the effective of css 12层次样式表高级语法层次样式表高级语法样式表的组合带上下文的样式表样式类样式表
5、的继承和覆盖13样式表的组合样式表的组合样式表的组合可以分为针对多个元素组合样式表和使用某些特性来组合样式表两类 两个不同元素可能有着相同的样式表 h1,pfont-size:12pt;font-weight:bold;color:red 有时某个元素的若干样式特性都跟某类样式如字体有关pfont:bold 20pt;14example for style compositionThis is H1 elementLets see the effective of css 15example for style composition 2This is H1 elementLets see t
6、he effective of css 16带上下文的样式表带上下文的样式表 时我们希望某些元素在不同的上下文环境中体现不同的样式,典型的就是li元素,我们可能希望作为ol元素子元素的li元素和作为ul元素的li元素能够体现不同的样式,为此样式表语法中提供了带上下文的样式表语法。我们可以通过指定元素的父元素的方法来指定上下文:将父元素和子元素之间用空格隔开,后跟包含在大括号中的特性列表,ol lifont:12pt bold;color:red 17example for context-aware styleThis is H1 elementol li1ol li2ul li1ul li2
7、 18样式类样式类很多时候我们希望对页面有非常精确的控制能力,如可以为任意一个元素指定样式,或为任意某几个元素指定相同的样式。为此样式表的语法中提供了样式类的相关概念。如果希望为任意一个元素指定样式,这就需要用到元素的id通用属性。#selectfont:14pt bold;color:green如果为任意某几个元素指定相同的样式,则需要用到元素的class通用属性.selectfont:14pt bold;color:green19example for style with id propertyThe Wild Swans at Coole William Butler Yeats Th
8、e trees are in their autumn beauty,The woodland paths are dry,Under the October twilingt the waterMirrors a still sky;.20example for style with classThe Wild Swans at Coole William Butler Yeats The trees are in their autumn beauty,The woodland paths are dry,Under the October twilingt the waterMirror
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 层次 样式
1、咨信平台为文档C2C交易模式,即用户上传的文档直接被用户下载,收益归上传人(含作者)所有;本站仅是提供信息存储空间和展示预览,仅对用户上传内容的表现方式做保护处理,对上载内容不做任何修改或编辑。所展示的作品文档包括内容和图片全部来源于网络用户和作者上传投稿,我们不确定上传用户享有完全著作权,根据《信息网络传播权保护条例》,如果侵犯了您的版权、权益或隐私,请联系我们,核实后会尽快下架及时删除,并可随时和客服了解处理情况,尊重保护知识产权我们共同努力。
2、文档的总页数、文档格式和文档大小以系统显示为准(内容中显示的页数不一定正确),网站客服只以系统显示的页数、文件格式、文档大小作为仲裁依据,平台无法对文档的真实性、完整性、权威性、准确性、专业性及其观点立场做任何保证或承诺,下载前须认真查看,确认无误后再购买,务必慎重购买;若有违法违纪将进行移交司法处理,若涉侵权平台将进行基本处罚并下架。
3、本站所有内容均由用户上传,付费前请自行鉴别,如您付费,意味着您已接受本站规则且自行承担风险,本站不进行额外附加服务,虚拟产品一经售出概不退款(未进行购买下载可退充值款),文档一经付费(服务费)、不意味着购买了该文档的版权,仅供个人/单位学习、研究之用,不得用于商业用途,未经授权,严禁复制、发行、汇编、翻译或者网络传播等,侵权必究。
4、如你看到网页展示的文档有www.zixin.com.cn水印,是因预览和防盗链等技术需要对页面进行转换压缩成图而已,我们并不对上传的文档进行任何编辑或修改,文档下载后都不会有水印标识(原文档上传前个别存留的除外),下载后原文更清晰;试题试卷类文档,如果标题没有明确说明有答案则都视为没有答案,请知晓;PPT和DOC文档可被视为“模板”,允许上传人保留章节、目录结构的情况下删减部份的内容;PDF文档不管是原文档转换或图片扫描而得,本站不作要求视为允许,下载前自行私信或留言给上传者【a199****6536】。
5、本文档所展示的图片、画像、字体、音乐的版权可能需版权方额外授权,请谨慎使用;网站提供的党政主题相关内容(国旗、国徽、党徽--等)目的在于配合国家政策宣传,仅限个人学习分享使用,禁止用于任何广告和商用目的。
6、文档遇到问题,请及时私信或留言给本站上传会员【a199****6536】,需本站解决可联系【 微信客服】、【 QQ客服】,若有其他问题请点击或扫码反馈【 服务填表】;文档侵犯商业秘密、侵犯著作权、侵犯人身权等,请点击“【 版权申诉】”(推荐),意见反馈和侵权处理邮箱:1219186828@qq.com;也可以拔打客服电话:4008-655-100;投诉/维权电话:4009-655-100。