Tag Archives: css3
书写整洁优雅的CSS3代码
CSS3已经开始被大家广泛的运用到产品中的页面代码中去,CSS3带来的革新式的变化我在这里就不一一细说了。不过因为目前的CSS3还处在草案阶段,所以绝大部分的浏览器(除了opera应该是)都是使用的私有属性的方式来实现对CSS3的支持。比如firefox的-moz-前缀和webkit核心浏览器的-webkit-前缀等。 整洁优雅的代码能提高生产效率,特别是在团队合作中。我想很多人都习惯把css代码写成一行的形式,诸如这样: .main{width:960px;margin:0 auto;} .sidebar{width:233px;float:left;} .sidebar ul li{float:left}.main{width:960px;margin:0 auto;} .sidebar{width:233px;float:left;} .sidebar ul li{float:left} 采用这样的一行形式,能让你们整齐的排列相似父辈继承的样式,让他们很简单的能被查找到。当然为了更好的查找到代码,你们可能还需要一个注释。 /* something u want to say ————————————————–*/ .main{width:960px;margin:0 auto;} .sidebar{width:233px;float:left;} .sidebar ul li{float:left}/* something u want to say ————————————————–*/ .main{width:960px;margin:0 auto;} .sidebar{width:233px;float:left;} .sidebar ul li{float:left}
消失的CSS3 box-shadow 属性?
如果你在疑惑为什么标题后面是个问号,因为我也不确定具体这个box-shadow属性是否消失后就不再回来了。发生了什么事?其实就是最近在看W3C关于css3的20091217文档的时候发现box-shadow属性已经没有任何说明了,只留下这么一段话: This module previously defined a ‘box-shadow’ property. This feature has been removed from this module for further discussion, and should reappear in another CSS module (or a later version of this module) in the near future. 以前这个模块定义了一个‘box-shadow’属性。这个特性目前已从这个模块中移除以做进一步的讨论,并将会出现在别的 CSS 模块中(或者更高版本的此模块)在不久的将来。 … Continue reading
两个CSS3样式可视化生成工具:CSS3 Please & CSS3 Generator
CSS3随着浏览器的升级已经被越来越广泛的运用,合理的运用CSS3可以使你的网站更加美观,并且之前只能用js才能实现的效果也已经可以直接用CSS3来实现。但是虽然如此,很多浏览器对CSS3的支持还都是通过其私有属性来达到支持的,鲜有直接对W3C的标准来实现的。诸如firefox的-moz-和webkit的-webkit-属性前缀。 不过CSS3本身W3C也并未有正式版发布,现在还只是草案。下面我推荐两个很直观的,可视化的,自动生成CSS3样式代码的工具网站给大家。 1.CSS3 Generator 选择自己想要的CSS3属性,然后填写数值,右边便可直观的展示出效果了,然后你复制生成的样式代码即可。并且还列出了兼容这些样式的浏览器。可谓十分的方便。 http://www.css3generator.com/
浏览器专属 CSS Hack:区分 Firefox / Opera / Safari / Internet Explorer
CSS Hack 是在标准 CSS 没办法兼容各浏览器显示效果时才会用上的补救方法,在各浏览器厂商解析 CSS 没有达成一致前,我们只能用这样的方法来完成这样的任务。网上你可能能搜索到一大堆的 CSS Hack,但是我今天发布的你可能并不都很了解,因为这些都是只针对单独一个浏览器的 CSS Hack。
CSS 改变选取文字的颜色(CSS3 – 目前 Firefox/Safari only)
无疑在这个技术迅猛发展的现在,css2 已经显得何其单薄,css3 草案出来后,无疑将为 web 设计带来更多新奇的效果。选取文字颜色的改变就是 css3 中的一项规范。虽然出来得比较早了,但是鉴于还有很多人不知晓,所以我写出来分享给大家。