随笔分类 -  CSS

摘要:<div> <div><img src="http://images.cnblogs.com/menu_01.jpg" width="163" height="8" alt=""></div> <div ><jdoc:include type="modules" name="left" /></div> <div><img src="http://images.cn 阅读全文
posted @ 2012-03-11 13:26 xngeer 阅读(264) 评论(0) 推荐(0)
摘要:1.IE条件注释注:<!--[if IE]><![endif]--> 只在IE下有效<!--[if IE 6]><![endif]--> 只在IE6有效 7,8同理<!--[if gt IE 6]><![endif]--> 只在IE6以上版本有效 lte:<= lt:< gte:>= gt:> !:!=2.选择符前缀法:“*html” 前缀只对IE6生效 "*+html"前缀只对IE7生效.test{width:80px;} /*IE 6 7 8*/*html .test{wid 阅读全文
posted @ 2012-03-11 13:25 xngeer 阅读(144) 评论(0) 推荐(0)
摘要:<<月份>>SUNMONTUEWEDTHUFRISAT选中的日期 阅读全文
posted @ 2012-03-11 13:00 xngeer 阅读(198) 评论(0) 推荐(0)
摘要:用CSS可以定义ul的自定义图标list-style:url(../images/sig1.jpg);在IE和FF下都能正常显示,但chrome不兼容。最好不要用这个属性,改为在li里定义背景图片:ul: list-style:none;li: background:url(../images/sig1.jpg) no-repeat; width:120px; 阅读全文
posted @ 2012-03-10 10:47 xngeer 阅读(254) 评论(0) 推荐(0)
摘要: 阅读全文
posted @ 2012-03-10 10:31 xngeer 阅读(361) 评论(0) 推荐(0)
摘要:如果不清除浮动,老三会跟在老二屁股后面<p >这个是第1列,</p> <p >这个是第2列,</p> <p >这个是列的下面。</p> float和absolute会让元素以inline-block方式显示,再显示地设置display为inline或block也无效。所以可以定义元素尺寸。 阅读全文
posted @ 2012-03-10 10:30 xngeer 阅读(128) 评论(0) 推荐(0)
摘要:float:left;margin:5px; /*IE6下会理解为10px*/display:inline;/*让它理解为5px*/ 阅读全文
posted @ 2012-03-10 10:30 xngeer 阅读(284) 评论(0) 推荐(0)
摘要:textarea{ resize:none; width:200px; height:100px; max-height:100px; max-width:200px; overflow:auto; /*使不显示滚动条*/} 阅读全文
posted @ 2012-03-10 10:27 xngeer 阅读(839) 评论(0) 推荐(0)
摘要:love hate原则:link visited hover active 阅读全文
posted @ 2012-03-10 10:26 xngeer 阅读(221) 评论(0) 推荐(0)
摘要:相邻的margin-left和margin-right不会重合,但margin-top和margin-bottom会重合。最好不要混用margin-top和margin-bottom,统一用其中一种,就像为<td>设边框。 阅读全文
posted @ 2012-03-10 10:26 xngeer 阅读(162) 评论(0) 推荐(0)
摘要:hasLayout是IE为解析盒模型而设计的一个专有属性,它的设计初衷是用于块级元素的,如果触发行内元素的hasLayout,就会让行内元素拥有一些块级元素的特性。display:inline-block 有width,height,margin,padding 却不独占一行,很好但IE6,7不支持inline-block,inline-block只能触发IE6,7下行内元素的hasLayout即:IE6,7下,设置inline-block的块级元素:白设行内元素:可设width,height... 效果同zoom:1例:abcde<span>12345</span> 阅读全文
posted @ 2012-03-10 10:25 xngeer 阅读(217) 评论(0) 推荐(0)
摘要:1. 怪异模式的触发与DTD有关。Document Type Definition。DTD包含元素的定义规则、元素间关系的定义规则、元素可使用的属性、可使用的实体或符号规则。2. 推荐的CSS组织方式:base+common+page base:css reset用YUI的CSS Reset+通用原子类 基石 common:组件级CSS类,网站中高度重用的模块 网站级 page:通用base和common解决的,就不要用page页面级3. 重用即为模块,取最大公约数。 模块应在保证数量尽可能少的原则下,做到尽可能简单,以提高重用性。4. 推荐CSS类命名法:驼峰命名法用于区别不同单词,... 阅读全文
posted @ 2012-03-10 10:24 xngeer 阅读(249) 评论(0) 推荐(0)
摘要:1. z-index为负,可以创造一些特殊的效果,但是无法监听鼠标事件,因为被z-index:0的body盖住了2. 如果多个元素的z-index相同,长江后浪盖前浪3. relative 或 absolute激活z-index可使元素重叠;设置负边距不激活z-index也可使元素重叠。问题1:Flash嵌入网页,不管如何设置z-index,都会浮于其它元素之上。 原因:浏览器解析页面时,窗口类型的元素显示在页面最顶端 <embed wmode="" <param name="wmode" value="" wmode属性 阅读全文
posted @ 2012-03-10 10:23 xngeer 阅读(330) 评论(0) 推荐(0)
摘要:水平居中: 1. 行内元素:父元素text-align:center; 2. 确定宽度的块级元素:margin-left/right:auto; 3. 不确定宽度的块级元素: a. 放在table的td里,table不是块级,但margin-left/right对它有效,table的宽度由它的内容决定。 缺点:增加无语义标签,加深标签的嵌套次数。 b. 将块级元素转化成inline,父元素taCenter 缺点:不能设定长宽 c. 父元素: float:left; position:relative; left:50%; 子元素: posit... 阅读全文
posted @ 2012-03-10 10:22 xngeer 阅读(210) 评论(1) 推荐(0)
摘要:通常情况下,td内无内容时没有边线(但也有时有,还未深究)解决方法: 给table加个border-collapse:collapse; 给td加个empty-cells:show; 阅读全文
posted @ 2012-03-10 10:20 xngeer 阅读(530) 评论(0) 推荐(0)
摘要:.transparentDiv{ filter:alpha(opacity=40); /*IE*/ -moz-opacity:0.4; /*MOZ FF*/ opacity:0.4; /*CSS3 FF1.5*/} 阅读全文
posted @ 2012-03-10 10:09 xngeer 阅读(140) 评论(0) 推荐(0)
摘要:添加层关闭我这里是要显示的内容 阅读全文
posted @ 2012-03-10 10:07 xngeer 阅读(188) 评论(0) 推荐(0)