css层的定位position、absolute、relative层叠加的五条叠加法则
摘要:css层的定位position、absolute、relative层叠加的五条叠加法则貌似很多同学对为什么这个div在上层,那个div在下层、无论如何设置z-index都无法居上的问题纠结抓狂、上吐下泻、恶心失眠、郁郁而终,致使不敢随意使用层的叠加。但层的叠加效果,在交互设计中却频频出现,所以我们必须驾驭它,要驾驭它,就要掌握其规律。首先明确几点在文中所需要用到的概念:静态定位:position:static(为position属性的默认值)。动态定位:position:relative或position:absolute或position:fixed。祖元素:任意包含该元素的元素。父元素:直
阅读全文
posted @
2011-03-03 15:56
JoeYoung
阅读(6419)
推荐(0) 编辑
CSS书写顺序建议及CSS HACK(FF&IE兼容)
摘要:CSS书写顺序建议及CSS HACK(FF&IE兼容)
阅读全文
posted @
2010-01-22 17:20
JoeYoung
阅读(839)
推荐(0) 编辑
一些IE6 IE7 IE8 FF的CSS hack
摘要:一些IE6 IE7 IE8 FF的CSS hack
阅读全文
posted @
2009-09-09 09:58
JoeYoung
阅读(840)
推荐(0) 编辑
Css Reset(样式复位)
摘要:一些标签元素在HTML下有一个默认属性值,我们在写css页面的时候,为了避免在css中重复定义它们,我们需要重置默认样式(css reset)。每个人的用法和写法都不一样。
阅读全文
posted @
2008-11-21 09:37
JoeYoung
阅读(689)
推荐(0) 编辑
漂亮的透明css菜单 下拉效果
摘要:css 并不总是意味着严谨、标准。这理有趣味、实验性的css技术运用实例与演示其中讨论的一些技术与实例也许并没有被测试过,可能有些浏览器无法渲染,有些允许是被确认过的给予标准设计与开发的。
下面这个效果展示了如何设计一个高级的支持透明效果的css下拉菜单。
阅读全文
posted @
2008-11-13 10:37
JoeYoung
阅读(2940)
推荐(0) 编辑
总结一些CSS经典技巧
摘要:一、 CSS border的缺省值 通常可以设定边界的颜色,宽度和风格,如: border: 3px solid #000 这位把边界显示成3像素宽,黑色,实线。但实际上这里只需要指定风格即可。 如果只指定了风格,其他属性就会使用缺省值。一般地,Border的宽度缺省是medium,一般等于3 到4个像素;缺省的颜色是其中文字的颜色。如果这个值正好合适的话,就不用设那么多了。
阅读全文
posted @
2008-11-08 10:44
JoeYoung
阅读(367)
推荐(0) 编辑
一些CSS类及id的规范化命名
摘要:Web开发人员可以通过创建CSS类及id名称并使用这些名称来对divs以及其他的格式页面元素进行标识。对开发人员来说,在命名重新定义XHTML标记(tags)的CSS selectors时,必须保证其与预定义的标记准确匹配,但就类以及id选择器名称而言,则仁者见仁,智者见智。然而随心所欲的为这些类以及id命名则并不是个好的习惯。
阅读全文
posted @
2008-11-06 10:05
JoeYoung
阅读(474)
推荐(0) 编辑
JS+CSS自动切换选项卡
摘要:随着Web开发人员开发了许多Ajax和CSS,Tab选项卡切换为基础的界面,成为一项非常有趣的技术,它让我们用一种简单的方式获得信息,而不需要打开和关闭多个窗口。尤其现在JQuery的流行,越来越多的插件很快的冒了出来。
今天分享一个自动切换的选项卡效果。
阅读全文
posted @
2008-10-29 10:51
JoeYoung
阅读(3360)
推荐(1) 编辑
Google Chrome 浏览器支持的 CSS 选择器
摘要:Google Chrome 浏览器是基于 Safari 正在使用的 Webkit 引擎,使用的版本是 AppleWebKit/525.13 。不过 Safari3.1 使用的是最新版本:AppleWebKit/525.18。
那 Google Chrome 浏览器对 CSS 选择器的支持又如何呢?
阅读全文
posted @
2008-10-27 11:45
JoeYoung
阅读(808)
推荐(0) 编辑
CSS HACK(ie6-ie7-fox 兼容)
摘要:都是写CSS中的一些HACK,这些都是用来解决局部的兼容性问题,如果希望把兼容性的内容也分离出来,不妨试一下几种过滤器。
阅读全文
posted @
2008-10-22 10:34
JoeYoung
阅读(2079)
推荐(1) 编辑
浮动居中float:center
摘要:今天看到了一种浮动居中方法,用float:center实现li是浮动的,并且是居中的(li个数不固定,ul宽度未知)。平时一般设置ul的text-align:center,再设置li的display,可以实现居中。 下面说一下float:center实现浮动居中的思路,采用的是相对定位:ul为position:relative;left:50%,然后再让li像左浮动,在让它position:rel...
阅读全文
posted @
2008-09-16 10:23
JoeYoung
阅读(14865)
推荐(1) 编辑
图片垂直居中的CSS技巧
摘要:今天遇到的问题:使用纯CSS实现未知尺寸的图片在275px的正方形容器中(高宽都小于275px)水平和垂直居中。 主要在于:图片未知大小,而且要求垂直居中。 下面是找的一个权衡的相对结构干净,CSS简单的解决方法: Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighli...
阅读全文
posted @
2008-09-03 11:38
JoeYoung
阅读(485)
推荐(0) 编辑
如何让Div放在Flash上面
摘要:我们在做网页的过程中,经常会加入Flash动画,但是有的时候Flash却常常给我们添乱,都是以“高高在上”的形式出现,就是说基本都会在最上层上。一般来说网页的层次结构可以通过Z-INDEX来设置调整,但是对Flash来说仿佛没有作用。 一种情况就是上次说的,下拉框被Flash遮挡住了,详见:z-index在IE中的迷惑(这个是有前提条件的)。还有一种情况就是今天一个朋友问我的,一个随网页上下浮动...
阅读全文
posted @
2008-07-22 14:54
JoeYoung
阅读(2281)
推荐(0) 编辑