qinxuzh-CSDN博客

原创略谈userChrome.css(自己动手设置Firefox的外观)转

在Firefox的外观定义中，Mozilla使用了类似XML的XUL界面语言来实现，并且引入CSS定义各个元素的属性，即userChrome.CSS。由于每个人的系统设置不同，加之中文和西文的字体显示有些不同，所以我们在使用hills的主题之前，一般都会根据自己的需要对useChrome做适当的修改（比如修改字形字号）。so..为了便于以后修改，先简单讲一下在默认情况下涉及到的CSS属性

2007-10-11 12:38:00 3481

原创 CSS伪类:hover 在IE中使用及其BUG

　　伪类:hover是我们在CSS设计中最常运用的伪类之一，许多绚丽效果的实现离不开伪类:hover，比如我们常见的纯CSS菜单、相册效果等等。　　或许用了这么久的伪类:hover，还有部分朋友还不完全了解hover的规则：在CSS1中此伪类仅可用于a对象。且对于无href属性（特性）的a对象，此伪类不发生作用。在CSS2中此伪类可以应用于任何对象。　　但目前IE5.5、IE6

2007-10-08 10:53:00 1872

原创如何实现CSS样式实时切换？

用W3C标准建造的网站，从理论上来说可以做到完全的表现与结构相分离。打个比方，就是可以在不动骨架（结构，XHMTL）和肌肉（行为，Javascript）的前提下，彻彻底底地换一身皮（表现，CSS）。当然，换皮之前你需要先按W3C标准建好你的网站，并且为它准备两套表现不一样的CSS。“换皮”实质上就是“换CSS”，我们要做的，只是用某种方法让浏览器载入另一套CSS，重新渲染页面。Java

2007-10-08 10:51:00 693

原创 CSS继承性之深入剖析（2）

　　在CSS中，继承是一种非常自然的行为，我们甚至不需要考虑是否能够这样去做，但是继承也有其局限性。　　首先，有些属性是不能继承的。这没有任何原因，只是因为它就是这么设置的，标准就是如此。举个例子来说：border属性，大家都明白border属性的作用是设置元素的边框的，它就没有继承性。如果继承了边框属性，那么文档看起来就会很奇怪。例如我们定义容器div的边框为1px，而在此容器内的ul

2007-10-08 10:48:00 537

原创 CSS继承性之深入剖析（1）

　　CSS的继承是指被包在内部的标签将拥有外部标签的样式性质。继承特性最典型的应用通常发挥在整个网页的样式预设，即整体布局声明。而需要要指定为其它样式的部份设定在个别元素里即可达到效果。这项特性可以给网页设计者提供更理想的发挥空间。但同时继承也有很多规则，应用的时候容易让人迷惑。　　CSS允许我们为文档设置更为丰富且便于修改的外观。我们现在主要想和朋友们一起对CSS的继承性进行一点深入的探

2007-10-08 10:46:00 780

原创 CSS中级教程组合与嵌套

组合你不必重复有相同属性的多个选择符，你只要用英文逗号（,）隔开选择符就可以了。比如，你有如下的代码：h2 { color: red; } .thisOtherClass { color: red; } .yetAnotherClass { color: red; } 则你可以这样写：h2, .thisOtherClass, .yetAnot

2007-10-08 10:45:00 973

原创 CSS2.0中最常用的18条技巧

　　应用Div+CSS网页面局，常常会遇到的CSS问题。经常不能很好的控制CSS，影响CSS的效率发挥。　　我们来分析总结一下相关的技巧，帮助大家更加容易的使用CSS！　　本文总结了使用CSS布局方法以来所有的技巧和兼容方案，我愿意把这些与你分享，我会重点解释一些新手容易犯的错误(包括我自己也犯过的)，如果你已经是CSS高手，这些经验技巧可能已经都知道，如果你有更多的，希望你可以帮我补

2007-10-08 10:38:00 426

原创 CSS之margin属性由浅入深详解

　　margin在中文中我们翻译成外边距或者外补白（本文中引用外边距）。他是元素盒模型（box model）的基础属性。一、margin的基本特性　　margin属性包括margin-top,margin-right,margin-bottom,margin-left,margin，可以用来设置box的margin area。属性margin可以用来同时设置box的四边外边距，而其

2007-10-08 10:33:00 760

原创 CSS优先权之深入剖析

　　优先权问题其实就是一个冲突解决的问题，当同一个元素（内容）被CSS选择符选中时，就要按照优先权取舍不同的CSS规则，这其中涉及到的问题其实很多。　　首先就是CSS规则的specificity（特殊性），CSS2.1有一套关于specificity的计算方式，用一个四位的数字串（CSS2是三位）来表示，最终specificity越高的规则越特殊，在优先级判定时也就越有优势。关于speci

2007-10-08 10:23:00 460

原创应该如何合理的应用CSS整体布局声明

　　1. 基本上，整体声明有两种方法，第一种就是针对一个标签，然后一次设定好几个样式。第二种就是同时对好几个标签设定相同的样式。下面这个例子就是：“针对一个标签，然后一次设定好几个样式”： body{font-size:9pt;font-color:red;background:white} 　　2. 你会发现，我们同时声明了：字形大小为 9pt、字形颜色为红色、

2007-10-08 10:20:00 640

原创 CSS高级教程页面布局

用CSS 来布局很容易。如果你已经习惯用表格布局的话，起先会感觉比较困难。其实不难，只不过动机不同，并且在实践中更有意义。你可以把这一页面的各个部分当作独立的版块来看待，无论你选择哪一块。你可以绝对或相对地用彼块取代此块。定位定位属性position用于定义一个元素是否absolute（绝对），relative（相对），static（静态），或者fixed（固定）。static

2007-10-08 10:18:00 604

原创 CSS高级教程 @规则

at（@）规则把CSS规则都注入了一个压缩胶囊中，并且应用到指定的某些事物中。喔。导入导入import at规则将吞入另外的样式表。比如，如果你需要把另外的样式表的样式添加到现有的，你可以这样做：@import url(addonstyles.css); 这经常用来取代连接CSS到HTML中的标签，本质上就是一个内部样式表的形式，看起来像这样：@import url(mon

2007-10-08 10:16:00 442

原创对display:inline与float:left正确含义的认识！

　　首先我们要明确，display:inline;与float:left;正确含义。display:inline;(内联)《CSS权威指南》中文字显示:任何不是块级元素的可见元素都是内联元素。其表现的特性是“行布局”形式，这里的“行布局”的意思就是说其表现形式始终以行进行显示。比如，我们设定一个内联元素border-bottom:1px solid #000;时其表现是以每行进行重复，每一

2007-10-08 10:14:00 604

原创 CSS hack的一些思考我们该如何面对它？

　　我已经习惯了做好页面之后去解决不同浏览器的兼容性问题，不断的测试，不停的修改CSS hack以保证在大部分的浏览器上得到最佳效果。光IE就需要兼顾IE5.X与IE6，以后也许还要为IE7 来写单独的CSS hack，或许是这样的工作做得多了开始讨厌这样的没有效益的劳动。就是为了去满足那些少数的IE5.0用户或是为了满足那些极端的 Firefox或是 Opera的推崇者们，我需要花费

2007-10-08 10:08:00 362

原创 CSS代码结构初探：再谈div和span！

　　我们在规划网页的结构时通常会用到div。我们正常都认为div是一个没有语意的标签，它的作用是用来分割文档的不同区域。但我们也发现，有些人认为div是有语意的。只不过它不象h1或ul等那些标签的语意那么明确而已，div的语意是division，英文的意思是区分、分开、部分。即用它来分割文档的不当部分。我们在正常编码中，会给div 分配一个id名称，这样也使得文档具有了结构的意义，例如：i

2007-10-08 10:01:00 617

原创深入css结构的探讨如何运用div和span才是合理的！

　　关于div，说法很多。把div看成是布局元素这种观点我想是最多的，类似有“用div代替table进行布局”、“实战CSS+DIV布局”等等等等，太多了，还有不少人延用Dreamweaver的定义，称div为层，按Photoshop的层的概念来使用……有朋友干脆就直接称div和span为辅助布局元素。　　怎么说呢？虽然我很想说对div类似的这种认识是错误的，div不是一个布局元素，没有一

2007-10-08 09:54:00 624 1

原创 IE中的z-index迷惑（2）

　　IE中z-index的BUG。首先看下面的代码：XHTML部分：这个box应该在上面这个box应该在下面，IE浏览器会对定位元素产生一个新的stacking context ，甚至当元素 z-index的为“auto”。CSS部分：#container { position: relative; }#box1 { position: absolute;

2007-10-08 09:39:00 496

原创 IE中的z-index迷惑（1）

CSS的z-index属性，看下面的介绍：z-index : auto | number 　　auto: 默认值。　　number: 无单位的整数值，可为负数。　　z-index值较大的元素将叠加在z-index值较小的元素之上。对于未指定此属性的定位对象，z-index 值为正数的对象会在其之上，而 z-index 值为负数的对象在其之下。　　注意：这个属性不会作用

2007-10-08 09:30:00 707 1

转载 IE7 beta2的CSS兼容性

当IE7 beta1推出的时候，我在第一时间对它作了个测试。当时发现它对CSS的支持几乎没有任何变化，着实失望了一阵。MS在最近推出了 IE7 beta2，这次有了不少新的改进和变化。但这些改进和变化会导致一些原来正常网页出现布局错误或者原来可以使用的Hack技巧不再可用。 MSDN在年初的时候把这些可能产生的问题罗列给开发者（这是原文），这里我把其中比较主要的问题简单地描述一下，希望能对

2007-09-25 15:02:00 421

网页标准学习文档