用xslt+css让RSS显示的跟网页一样漂亮

最近开始研究 XML+XSLT+CSS 构造网页..又拿自己的站的一部分当成实验品..
因为我把这个站的实验室的东西扔在别一个服务器上..可又懒得再做个首页,,,就同步了这边的 RSS.当首页
可没关联的样式的XML怎样看怎样不喜欢....

直接关联 CSS 能把 XML 能变成像样一点..虽然不是最终目的..可还是要学习一下..因为不是所有的浏览器都支持XSLT 
我能用到的浏览器好像都能认识关联的 CSS ~可惜单单 CSS 能做的事太少了. 还是xslt好..

写直接用于 XML 的 CSS 跟平时写的 CSS 基本没什么差别...只是元素名不同了.难度高高...写 HTML 的自由没有了...也不可以因为想要某个效果而乱加元素...
好像我的水平决定了我只能写出定义得比文本好看一下下的CSS, 接着.看例子. 跳掉..研究 XSLT 了

xslt 能做的事很多..xml 终于可以直接当网页用了..

打开一份别人写好的 xslt 发现....好多熟悉的东东..........
对于应用在RSS..我们对XLST只要知道

xsl:for-each select="rss/channel/item" 
xsl:value-of select="..." 
disable-output-escaping="yes" 
一个循环 一个选择节点....一个设置禁止输出转义时 
接着复制了我程序用的模板文件.....把 smarty 的标签直接换成 xsl 的..太像了..我连 html 都不用写..一路复制..
等网站的核心程序写完后我一定要尝试用xslt直接做smarty模板...

接着整理出一个单独的CSS 本以为就这样完了.........
-____________-!! 每次做网页时总会有些浏览器会闹闹情绪...这回是 moz 内核的....
我需要显示 CDATA 里的 HTML ,让他更像个网页,
可搜索跟我说 Mozilla 的 Transformiix 不支持 disable-output-escaping

我记得 feedburner 能在 Firefox 显示 CDATA 里的 HTML 代码~
看了他的 xslt 跟搜索的结果发现.......基本都是用JS的innerHTML把内容再写进一次就能显示........

原因我也不清楚.....学着大家方法.把 disable-output-escaping 勉强解决了.........

写 JS 时又发现...JS 有些怪怪的...比如....直接写在 xslt 里跟外链有些不同..
本想就一个页..一个 function 乱写能运行就行....结果又发现N多奇怪的问题..暂时也没时间去研究他....等有空再写些测试...

说了这样多的废话..
大家看看我的学习的结果, http://lab.loaoao.com

扩展阅读 
http://www.w3.org/TR/xslt/ 
http://www.xml.org.cn/list.asp?boardid=8 
www.w3schools.com/xsl/ 
hedong.3322.org/archives/000044.html

赞 (0)

相关推荐

  • 用xslt+css让RSS显示的跟网页一样漂亮

    最近开始研究 XML+XSLT+CSS 构造网页..又拿自己的站的一部分当成实验品.. 因为我把这个站的实验室的东西扔在别一个服务器上..可又懒得再做个首页,,,就同步了这边的 RSS.当首页 可没关联的样式的XML怎样看怎样不喜欢.... 直接关联 CSS 能把 XML 能变成像样一点..虽然不是最终目的..可还是要学习一下..因为不是所有的浏览器都支持XSLT  我能用到的浏览器好像都能认识关联的 CSS ~可惜单单 CSS 能做的事太少了. 还是xslt好.. 写直接用于 XML 的 CS

  • jquery+CSS实现的水平布局多级网页菜单效果

    jquery+CSS实现的水平布局多级网页菜单效果

    本文实例讲述了jquery+CSS实现的水平布局多级网页菜单效果.分享给大家供大家参考.具体如下: 这里演示的Jquery和CSS共同实现的网页常见的导航菜单,支持两级形式,蓝色风格,最多支持二级,三级可能要对代码进行改造了.本菜单属于中规中矩型,实用性比较强,适合的网站种类也是很多的,希望大家会喜欢. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-css-scroll-nav-menu-style-codes/ 具体代码如下:

  • CSS：自定多姿多彩的网页链接下划线

    CSS本身没有直接提供变换HTML链接下划线的功能,但只要运用一些技巧,我们还是可以让单调的网页链接下划线变得丰富多彩. 一.基本原理 首先,自定义HTML链接下划线的第一步是创建一个图形,在水平方向重复放置这个图形即形成下划线效果.如果要显示出下划线背后的网页背景,可以使用透明的.gif图形. 其次,如果下划线图形的高度较大,则必须适当增加文本的高度,使得一行文本的底部与下一行文本的顶部之间有较大的空间,例如p { line-height: 1.5; }. 自定义链接下划线示例 第三,为显示出

  • CSS编辑工具Topstyle轻松打造网页风格

    CSS编辑工具Topstyle轻松打造网页风格

    本文特意为你找来了一款CSS编辑利器--Topstyle,利用它你能轻松做出更有风格的网页来! 精彩.漂亮是每一个设计者在制作网页时的不懈追求,而网页的精彩几乎都离不开CSS的强力"支撑":CSS是一种为超文本标签语言提供增强补充服务的技 术,可对每一个html的标签做精雕细刻的修饰.活用CSS,将会使网页更加生动活泼.不过,普通的网页编辑工具在CSS方面,表现难能让人满意:为了充 分发挥CSS潜能,设计出更加美丽的网页. 最新版本:3.11 文件大小:3836KB 软件性质:共享 使

  • asp.net显示自己的网页图标的几种方式

    如果你是用IE7以上的版本,或者用多tab的浏览器,你一定会发现tab前边的个性图标,这个是怎么弄的呢 一直不太明白,偶然的机会,同事告诉我了几种做法,贴出来和大家分享 1. 直接放个ico图标到你网站的根目录,并命名为favicon.ico就可以了.favicon.ico应是16×16的1个256色的图标. 但对于低版本的IE看不到,可 在网页的<head>与</head>标记之间加入如下标记就可以了. 复制代码 代码如下: <link rel="icon&quo

  • 用CSS代码轻松Diy你的网页滚动条

    在浏览网页的时候我们有时可以看到有的网页滚动条颜色不是系统默认的,而是漂亮的红色或其它颜色,其实这就是在网页代码之间加入代码来实现的,具体是哪些代码呢?      网页滚动条代码及其解释如下:(复制时请将大写尖括号改为小写) 以下是引用片段:<Style type="text/css"><!--   Body {  scrollbar-face-color:#C0C0C0; (表面)  scrollbar-highlight-color:#FFFFFF;(亮边)  s

  • css 有弹动效果的网页导航

    css 有弹动效果的网页导航

    这是一个导航 #nav{ list-style:none; margin:0; padding:5px 0 0 0; background:#F0F0F0; } #nav li{ float:left; display:inline; margin-right:2px; } #nav a{ float:left; width:81px; height:28px; text-align:center; background:url(http://www.jb51.net/upload/200910

  • JSP技术实现RSS订阅功能的示例

    RSS也叫聚合RSS是在线共享内容的一种简易方式(也叫聚合内容,Really Simple Syndication).通常在时效性比较强的内容上使用RSS订阅能更快速获取信息,网站提供RSS输出,有利于让用户获取网站内容的最新更新.同时也是医学.物理学.数学等学科专有名词的英文缩写简称. 最初的RSS要追溯到1995年,当Ramanathan V. Guha和其他在苹果电脑公司的高级技术组开发了一个测试的内容框架.更多有关RSS的资料可查看这里,下面我们来为我们的JSP网站生成RSS. RSS用

  • XSLT轻松入门第一章：XSLT的概念

    XSLT轻松入门第一章：XSLT的概念

    1.XSLT的概念 1.1 什么是XSLT 1.2 为什么要用XSLT 1.3 XSLT的历史 1.4 什么是XPath 1.5 XSLT和CSS的比较 1.6 XSLT和IE5 1.XSLT的概念 我们首先来澄清一个概念,大家可能听说过XSL(eXtensible Stylesheet Language),XSL和我们这里说的XSLT从狭义上理解是一样的,而按照W3C的标准,XSLT的说法更严格些,因此我们在文章中统一使用XSLT的称法.它们之间具体的关系我们会在下面讲述. 1.1 什么是XS

  • 用 Asp.Net 建立一个在线 RSS 新闻聚合器的方法

    随着办公室和家庭上网在线时间的延长,以及 Web 站点和可访问的互联网应用程序呈持续爆炸性增长,应用程序之间能数据共享变得越来越重要.在异构平台之间共享数据需要一种平台中立的数据格式,这种数据格式要求能易于通过标准的互联网协议来传输,而这正是XML的用武之地.因为XML文件本质上只是一个文本文件,其编码格式众所周知,而且现有的XML解析器能为所有主流编程语言所用,所以XML数据能被任何平台轻松使用. Web 网站聚合就是一种使用 XML 来共享数据的范例,在新闻站点和网志中经常可以看到.采用 W

随机推荐