前天,W3C发布了他们的网页编辑器 - Amaya 10。开源软件,提供了多平台的版本。编辑器除了支持HTML和CSS以外,还支持SVG(W3C制定的“可升级矢量图形”)和PDF等...遗憾的是目前还不支持中文对中文的支持比较差。
界面相对简陋,不过表达的十分清晰,标准的可视化工具。如果在中文的支持方面有所改善,绝对是网页设计师用来代替dreamweaver的好工具。本人由于长期受TextMate的照顾,不太习惯可视化工具,所以很快就放下了...
pre标签用来显示预格式(preformatted)文本,实际应用中我一般用来显示各种代码。
以前通常会给pre定义这样的CSS,使pre不被过长的文本撑破,而出现滚动条:
pre { overflow: auto; width: 515px; }但是当横向、纵向滚动条同时存在时,很让人抓狂。于是在CSS 3中,white-space有了一个新的值pre-wrap,再加上一些浏览器的私有属性,我们就得到了解决方案:
pre {
white-space: pre-wrap; /* 支持css 3的浏览器 */
white-space: -moz-pre-wrap; /* 老版Mozilla*/
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* IE 5.5以上 */
} opacity是CSS 3里的一个属性,用来设定元素的透明度。当然现在还只有少部分浏览器支持。
不过各个浏览器都有自己的私有属性来支持,其中包括老版本的Mozilla和Safari:
filter:alpha(opacity)-moz-opacity-khtml-opacity很不幸的是,你没看见Opera,老版本的Opera并没有什么私有属性可以代替opacity。(新版Opera已经支持opacity)
所以以前用CSS设定一个元素半透明的话,可能会这样写:
.opacity{
filter:alpha(opacity=50); /* IE */
-moz-opacity:0.5; /* 老版Mozilla */
-khtml-opacity:0.5; /* 老版Safari */
opacity: 0.5; /* 支持opacity的浏览器*/
}用javascript来设定一个元素为半透明:
object.filter = "alpha(opacity=" + opacity + ")"; /* IE */
object.MozOpacity = (opacity / 100); /* 老版Mozilla */
object.KhtmlOpacity = (opacity / 100); /* 老版Safari */
object.opacity = (opacity / 100); /* 支持opacity的浏览器*/ 最近不少人问我CSS Validator的时候,发现不少警告(warnings),都是提示“You have no color with your background-color” and “You have no background-color with your color”,很烦人,而且量很大,很难看.其实在不在意还是看个人,但是要明白的是他们为什么这么做?这其中有一个亲和力(accessibility)的因素.文章的大意来自CSS Validator colour warnings are not errors
这些警告源于一个亲和力的因素,提醒你注意运用颜色.CSS Validator想帮你解决你写的样式与用户的自定义样式或者系统的颜色配置之间的冲突.W3C CSS Validator 帮助这样写到:
If you don’t specify color and background-color at the same level of specifity, your style sheet might clash with user style sheets.
问题是这样的,主流的浏览器都可以自己设定背景颜色和文字颜色,比如IE("工具"-"Internet选项"-"常规"-"颜色"),用户如果设定了使用自定义颜色配置,这将会影响到他浏览你的站点时的效果.主要还是体现在背景色和文字颜色上,其实这已经够吓人了(比如文字颜色和背景颜色是相同的...),所以有时候还是有必要去注意某些警告提示的.
错误和警告都有他的原因,你必须学会去理解他们.