相同结构的40种CSS布局

对于相同的结构,我们可以通过CSS来创造出40种不同的布局,可以从中学到布局的很多知识,也可以体验出CSS的强大和标准的便捷。 http://blog.html.it/layoutgala/

... 1 条评论 »

The W3C Technology Stack

The Web is an application built on top of the Internet 原文地址:《The W3C Technology Stack》 翻译地址:《w3c技术架构介绍》 一种发展,一种趋势,一份把握,一份机遇!

... 2 条评论 »

z-index在IE中的迷惑(二)

IE中z-index BUG 首先先来看一个演示例子的代码部分。 XHTML 部分: <div id=”container”> <div id=”box1″>这个box应该在上面</div> </div> <div id=”box2″>这个box应该在下面,IE浏览器会对定位元素产生一个新的stacking context ,甚至当元素 z-index的为“auto”。</div> CSS 部分: #container { position: relative; } #box1 { position: absolute; top: 100px; left: 210px; width: 200px; height: 200px; background-color: yellow; z-index: 20; } #box2 { position: absolute; top: 50px; left: 160px; width: 200px; height: 200px; background-color: green; z-index: 10; […]

... 13 条评论 »

z-index在IE中的迷惑(一)

z-index 属性简介 z-index : auto | number auto: 默认值。 number: 无单位的整数值,可为负数 。 z-index 值较大的元素将叠加在 z-index 值较小的元素之上。对于未指定此属性的定位对象,z-index 值为正数的对象会在其之上,而 z-index 值为负数的对象在其之下。 注意:这个属性不会作用于窗口控件,如 select 对象。在IE5.5+中, iframe 对象开始支持此属性。而在之前的浏览器版本中, iframe 对象是窗口控件,会忽略此属性。 z-index 属性适用于定位元素(position 属性值为 relative 或 absolute 或 fixed的对象),用来确定定位元素在垂直于显示屏方向(称为Z 轴)上的层叠顺序(stack order)。 每一个定位元素都归属于一个stacking context。根元素形成 root stacking context,而其他的 stacking context 则由定位元素产生(此定位元素的 z-index 被定义一个非 auto 的 z-index 值),定位子元素... 5 条评论 »

XSL中如何将CDATA输出为HTML

最近几天在学习、练习、研究 XML 和 XSL ,今天在练习的时候碰到如何将 XML 中的 CDATA 注释部分内容按照 HTML 的格式输出,下面提供两种方法(其实是两种浏览器中的方法): 1、使用disable-output-escaping=”yes”,不过FF不支持。 2、使用脚本可以实现 Firefox 下的显示)。 // JavaScript Document by aoao var escaping=function(){ if(!document.getElementById){ return false;} var interim; var temp = document.getElementsByTagName(“DIV”); var tempLen = temp.length; var pattern = new RegExp(“(^|\\s)description(\\s|$)”); for (i = 0; i < tempLen; i++) { if ( pattern.test(temp[i].className) ) { interim […]

... 0 条评论»

XSL 属性模板的运用

XML中 <home>http://www.planabc.net</home> 如果我们在 XSL 中要调用 home节点的值作为 a 标签的 href 属性值,该如何应对呢? 我们可以通过给 a 标签添加一个属性,具体语法: <xsl:attribute name=”href”>http://www.planabc.net</xsl:attribute> name 属性表示要添加属性的名字,标记包含的内容为要添加属性的值。 根据上面的介绍我们在 XSL 中可以写成这样: <xsl:element name=”a”> <xsl:attribute name=”href”><xsl:value-of select=”home” /></xsl:attribute> Index </xsl:element> 或者: <a title=””> <xsl:attribute name=”href”><xsl:value-of select=”home” /></xsl:attribute> Index </a> 在 XSL 中还有一个更简单更方便的方法,就是用属性模板,可以直接在 XSL 中这样使用: <a title=”” href=”{home}̶... 4 条评论 »

关于cellspacing和cellpadding

表格的 cellspacing 和 cellpadding 我们经常会用如下的方式来清除默认样式: <table cellspacing=”0″ cellpadding=”0″></table> 很多朋友会说表现在结构中,这样不符合标准,那如何将这个表现拿出来,有些朋友或许很迷惑。我们可以用 table 的 border-collapse: collapse; 属性 来代替cellspacing=”0″,用 th,td 的 padding: 0; 属性来代替 cellpadding=”0″。 table { border-collapse:collapse; border-spacing:0; } th,td { padding: 0; } 还可以用 expression 来实现 cellpadding=”0″ 的样式: table { border-collapse:collapse; border-spacing:0; padd:expression(this.cellPadding=0); } 下面我们看下《HTML与CSS入门经典(第7版)》一书中对这两个属性的描述: 对表格的设置不仅可以使用style属性。例如,可用 cellpadding 和 cellspacing 属性来控制表格边框的间距。cellspacing 属性设置表格边框之... 1 条评论 »