原理：
当两个同父元素z-index相同时，后面的元素显示在上面。
当z-index超过浏览器最大值时，浏览器会按最大值计算。
方法：
连续放置两个div元素d1，d2；并设定position:absolute及不同背景色。
设定d1.z-index = max + 1, d2.z-index = max；
当max + 1有效时，d1在前；当max + 1 无效时，d2在前。（参看原理）
设定d1.z-index = min, d2.z-index = min - 1；
当min - 1有效时，d1在前；当min - 1 无效时，d2在前。（参看原理）
结果：
ver.
max
min
typeof(div.style.zIndex)
IE
8.0
2147483647
-2147483648
number
Chrome
3.0.195
2147483647
-2147483648
string
FF
3.5.7
2147483645
-2147483647
string
Opera
10.10
2147483584
-2147483584
string
结论：
当需要兼容以上所有浏览器时，z-index需使用 -2147483584 ~ 2147483584 范围内的数字
......
body{ background:#FFFFFF; font-size:12px; font-family:‘宋体’, Arial, Helvetica, sans-serif;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,table,th,td,
img{margin:0;padding:0;}
.partA,.partB,.partC,.partD,.partE,.partF,.partG,.partH,.partI,.partJ,.partK,.partL,.partM,.partN,.partO,.partP,
.partQ,.partR,.partS,.partT,.partU,.partV,.partW,.partX,.partY,.partZ{ overflow:hidden;zoom:1;}
a{ text-decoration:none;}
a:link{ color:#333;}
a:visited{ color:#333;}
a:hover{ color:#F00; text-decoration:underline;}
a:active{ color:#333;}
ul,ol,li{ list-style:none;}
img{ border:0px;}
textarea,input,select{ font-size:12px;}
table {border-collapse: separate;border-spacing: 0;}
h1 {font-size:16px;}
h2 {font-size:16px;font-weight:normal;}
h3 {font-size:14px;}
h4 {font-size:14px;font-weight:normal;}
h5 {font-size:12px;}
h6 {font-size:12px ......
/* Cascading Style Sheet for IE4.01 last updated 10-16-97 */
DIV {COLOR: #333333; FONT-FAMILY: "宋体", "Arial", "Tahoma"; FONT-SIZE: 9pt}
P {COLOR: #333333; FONT-FAMILY: "宋体", "Arial", "Tahoma"; FONT-SIZE: 9pt}
TD {COLOR: #333333; FONT-FAMILY: "宋体", "Arial", "Tahoma"; FONT-SIZE: 9pt}
BODY {COLOR: #333333; FONT-FAMILY: "宋体", "Arial", "Tahoma"; FONT-SIZE: 9pt}
A {font-family: "宋体"; font-size: 9pt; color: #333333; text-decoration: none}
A:Link {font-family: "宋体"; font-size: 9pt; color: #333333; text-decoration: underline}
A:Hover{font-family: "宋体"; font-size: 9pt; color: #3399CC; text-decoration: none}
A:Visited {font-family: "宋体"; font-size: 9pt; color: #663333; text-decoration: underline}
.lefty div {font-family: "宋体"; font-size: 9pt; color: #996633; text-decoration: none }
.lefty td {font-family: "宋体"; font-size: 9pt; color: #996633; text-decoration: none }
.lefty A {font-family: "宋体"; font-size: 9pt; color: #CC9933; text-decoration: none}
.lefty A: ......
转载于 罗马集市
Magento的CSS文件一般存放到 $MAGENTO_INSTALLED_FOLDER/skin/{frontend | admin |
install}/<package name>/<theme
name>/css目录下。也有些和全局js脚本配合使用的css文件存放在$MAGENTO_INSTALLED_FOLDER/js下，但是一
般我们不直接调用它们。
那么Magento应用又是如何引用CSS文件的呢？
方式I. 最一般的方法是配置全局block. 在page.xml中有
Xml代码
<
default
>
<
block
type
=
"page/html"
name
=
"root"
output
=
"toHtml"
template
=
"page/3columns.phtml"
>
<
block
type
=
"page/html_head"
name
=
"head"
as
=
"head"
>
<
action
method
=
&qu ......
当你看到<input>这个html标签的时候，你会想到什么？一个文本框？一个按钮？一个单选框？一个复选框？……对，对，对，它们都对。也许你可能想不到，这个小小的input竟然可以创造出10个不同的东西，下面是个列表，看看，哪些是你没有想到的：
<input type="text" /> 文本框
<input type="password" /> 密码框
<input type="submit" /> 提交按钮
<input type="reset" /> 重置按钮
<input type="radio" /> 单选框
<input type="checkbox" /> 复选框
<input type="button" /> 普通按钮
<input type="file" /> 文件选择控件
<input type="hidden" /> 隐藏框
<input type="image" /> 图片按钮
所以你可能会说，input真是一个伟大的东西，竟然这么有“搞头”，但是当你真正在项目中试图给不同的控件设置不同的样式时，你就会发现，input真的可以把“你的头搞大”。我不知道为什么当初要给input赋予那么多身份，但是，他的“N重身份”给网站设计者的确带来了不少的麻烦。好在，劳动人民是伟大的，解决问题的办法还是有滴～，虽然它们都� ......
Data visualization is mostly achieved with flash applications or
with help of some programming languages. Are those solutions the only
way to present, let's say simple data chart? How about giving it a try
with nothing but good ol' css?
Take a look at the Demo
| Download Css Chart
Approach
In this example I am not using JavaScript or any backend application. All I rely on is well formed markup and css.
So, the goal is to present data chart. We could say that a chart is a
two dimensional object. So, the best structural and semantical choice
is definition list. Why? Well, for starter, it is a list of items.
Although the list is linear, we could interpret definition titles (dt
elements) as items on x axis and definition descriptions (dd elements)
as values on y axis.
If that doesn't make sense because of my poor explanation skills :) what I'll do here is turn this:
into this
with css alone.
The markup
In my example I have used a period of last 12 days and presented ......
最新文章 : css