2012年7月14日

IE6的inline-block

摘要: 1、display:inline-block让一个元素具有“区块元素”的属性(可以设置width和height),又具有“内联元素”的属性(不产生换行)。2、IE中的inline-blockIE6不支持这个属性,但IE8开始支持这个属性。让IE6内联元素具备inline-block特性由于inline-block会触发IE的layout,所以IE6中只要设置{display:inline-block;}即可。让IE6区块元素具备inline-block属性,有两种方法A、可以先触发layout,再设置为inline,需要注意的是这两个display必须在两个CSS声明中才有效,代码如下:复制代 阅读全文

posted @ 2012-07-14 06:46 爱上某人 阅读(145) 评论(0) 推荐(0) 编辑

牛人也得看的15个CSS技巧(提高网页效率)

摘要: 而使用DIV+CSS的布局方法,将所有页面,或所有区域统一用CSS文件控制,就避免了不同区域或不同页面体现出的效果偏差。下面为大家介绍几点注意事项,希望能有所帮助:1、不要使用过小的图片做背景平铺。 这就是为何很多人都不用 1px 的原因,这才知晓。宽高 1px 的图片平铺出一个宽高 200px 的区域,需要 200*200=40, 000 次,占用资源。 2、无边框。 推荐的写法是 border:none;,哈哈,我一直在用这个。 border:0; 只是定义边框宽度为零,但边框样式、颜色还是会被浏览器解析,占用资源。 3、慎用 * 通配符。 所谓通配符,就是将 CSS 中的所有标签均初始化 阅读全文

posted @ 2012-07-14 06:43 爱上某人 阅读(117) 评论(0) 推荐(0) 编辑

提高CSS网页渲染效率的11点注意事项

摘要: 1、十六进制的颜色值对位数与大小写编写十六进制颜色值时你可能会用小写字母或省略成3位数,关于这写法没找到确实的数据证明对浏览器的渲染效率是否有影响,但十六进制的颜色值默认标准是大写及6位数标注。在未知情况下不希望冒险而降低了渲染的效率。* 不赞成 - color:#f3a;* 建议用 - color:#FF33AA;2、display与visibility的差异他们用于设置或检索是否显示对象。display隐藏对象不保留物理空间,visibility为隐藏对象保留占据的物理空间。当浏览器渲染被占据的物理空间时,会有所消耗资源。* 不赞成 - visibility:hidden;* 建议用 - 阅读全文

posted @ 2012-07-14 00:07 爱上某人 阅读(130) 评论(0) 推荐(0) 编辑

2012年7月13日

CSS文件可维护、可读性提高指南第2/2页

摘要: 三、格式化CSS属性当我们编写代码的时候,使用一些特殊的编码风格会对提高CSS代码的可读性有很大帮助。许多人都有各自不同的编码风格。一部分人习惯于将颜色和字体的代码放在前面,另外一部分则更喜欢将类似浮动和定位的更“重要”的属性放在前面。类似的,也可以将页面元素按照它在布局中的结构进行排序:body, h1, h2, h3, p, ul, li, form { margin: 0; padding: 0; border: 0; } 一些开发者用一种更为有意思的方法:他们将属性按首字母的顺序排列。值得注意的是,这样一种方法可能对某些浏览器会产生问题。不管自己的格式如何,你要确保你已经清晰的定义了这 阅读全文

posted @ 2012-07-13 23:58 爱上某人 阅读(118) 评论(0) 推荐(0) 编辑

css display:none使用注意事项小结

摘要: 1、如果在样式文件或页面文件代码中直接用display:none对元素进行了隐藏,载入页面后,在没有通过js设置样式使元素显示的前提下,使用js代码会无法正确获得该元素的一些属性,比如offSetTop,offSetLeft等,返回的值会为0,通过js设置style.display来使元素显示后才能正确获得这些值。2、使用display:none隐藏的元素不会被百度等搜索网站检索,会影响到网站的SEO,某些情况下可以使用left:-100000px来达到同样效果。3、如果是通过样式文件或<style>css</style>方式来设置元素的display:none样式,用 阅读全文

posted @ 2012-07-13 23:55 爱上某人 阅读(242) 评论(0) 推荐(0) 编辑

html 的 ContentType 小结

摘要: ContentTypes : "ez","application/andrew-inset" ContentTypes : "hqx","application/mac-binhex40" ContentTypes : "cpt","application/mac-compactpro" ContentTypes : "doc","application/msword" ContentTypes : "bin",&q 阅读全文

posted @ 2012-07-13 23:54 爱上某人 阅读(180) 评论(0) 推荐(0) 编辑

Chrome的hack写法以及CSS的支持程度图示

摘要: body:nth-of-type(1) p{ color: #333333; } 详细出处参考:http://www.jb51.net/article/15853.htm 阅读全文

posted @ 2012-07-13 23:52 爱上某人 阅读(134) 评论(0) 推荐(0) 编辑

让超出DIV宽度范围的文字自动显示省略号...

摘要: div.titleholder { font-family: ms sans serif, arial; font-size: 8pt; width: 100; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } 详细出处参考:http://www.jb51.net/article/16206.htm 阅读全文

posted @ 2012-07-13 23:46 爱上某人 阅读(115) 评论(0) 推荐(0) 编辑

CSS使用学习总结

摘要: 尽量少使用类,因为可以层叠识别,如: .News h3而不必在h3上加类 <div class=”News”> <h3></h3> <h2></h2> <p></p> </div> 3. 没有现有元素区分的情况下再用div <div id=”mainNav”> <ul> <li>Home</li> <li>About Us</li> </ul> </div> 可以改为 <ul id=”mainNav 阅读全文

posted @ 2012-07-13 23:45 爱上某人 阅读(110) 评论(0) 推荐(0) 编辑

IE hack条件写法

摘要: 最近制作下拉菜单时,打算用纯CSS,忽又看到令人头痛的CSS hack代码(平时很少关注),记录下来以作备用。<!–[if lte IE 6]>………….<![endif]–>Ite:less than or equal to意思是小于或等于IE6浏览器,用于IE浏览器的条件注释,常用于CSShack,针对IE的JS等。以下是各种情况,未验证。1. <!–[if !IE]><!–> 除IE外都可识别 <!–<![endif]–> 2. <!–[if IE]> 所有的IE可识别 <![endif]–> 3. 阅读全文

posted @ 2012-07-13 23:42 爱上某人 阅读(127) 评论(0) 推荐(0) 编辑

导航