网络编程
位置:首页>> 网络编程>> 网页设计>> Firefox的默认样式表

Firefox的默认样式表

作者:秦歌 来源:随网之舞 发布时间:2008-05-09 12:06:00 

标签:CSS,Firefox,YUI

每个浏览器都有自己的默认样式,这是一段预定义的CSS,用以简单地呈现网页。在Firefox中的地址栏中输入resource://gre/res/html.css即可以看到该浏览器的默认样式。在Firebug 1.2 Alphas的styles中就可以看到默认样式对页面定义样式的影响。毫无疑问,理解和学习浏览器的默认样式能更好的理解浏览器对解析样式和呈现页面。Firefox3和Firefox2相比,默认样式仅有8处不同,但这些改变也可以让我们感觉到Firefox3在样式上的改进:

@namespace url(http://www.w3.org/1999/xhtml); /* set default namespace to HTML *//* bidi */[dir="rtl"] {  direction: rtl;  unicode-bidi: embed;}[dir="ltr"] {  direction: ltr;  unicode-bidi: embed;}bdo[dir] {  unicode-bidi: bidi-override;}/* blocks */html, div, map, dt, isindex, form {  display: block;}body {  display: block;  margin: 8px;}p, dl, multicol {  display: block;  margin: 1em 0;}dd {  display: block;  -moz-margin-start: 40px;}blockquote {  display: block;  margin: 1em 40px;}address {  display: block;  font-style: italic;}center {  display: block;  text-align: -moz-center;}blockquote[type=cite] {  display: block;  margin: 1em 0px;  /*** start:Firefox2 ***/  padding-left: 1em;  border-left: solid;  /*** end:Firefox2 ***/  /*** start:Firefox3 ***/  -moz-padding-start: 1em;  -moz-border-start: solid;  /*** end:Firefox3 ***/  border-color: blue;  border-width: thin;}span[_moz_quote=true] {  color: blue;}pre[_moz_quote=true] {  color: blue;}h1 {  display: block;  font-size: 2em;  font-weight: bold;  margin: .67em 0;}h2 {  display: block;  font-size: 1.5em;  font-weight: bold;  margin: .83em 0;}h3 {  display: block;  font-size: 1.17em;  font-weight: bold;  margin: 1em 0;}h4 {  display: block;  font-weight: bold;  margin: 1.33em 0;}h5 {  display: block;  font-size: 0.83em;  font-weight: bold;  margin: 1.67em 0;}h6 {  display: block;  font-size: 0.67em;  font-weight: bold;  margin: 2.33em 0;}listing {  display: block;  font-family: -moz-fixed;  font-size: medium;  white-space: pre;  margin: 1em 0;}xmp, pre, plaintext {  display: block;  font-family: -moz-fixed;  white-space: pre;  margin: 1em 0;}/* tables */table {  display: table;  border-spacing: 2px;  border-collapse: separate;  margin-top: 0;  margin-bottom: 0;  /* XXXldb do we want this if we’re border-collapse:collapse ? */  -moz-box-sizing: border-box;  text-indent: 0;}table[align="left"] {  float: left;}table[align="right"] {  float: right;  text-align: start;}table[rules]:not([rules="none"]) {  border-collapse: collapse;}/* caption inherits from table not table-outer */caption {  display: table-caption;  text-align: center;  -moz-box-sizing: border-box;}table[align="center"] >gt; caption {  margin-left: auto;  margin-right: auto;}table[align="center"] >gt; caption[align="left"] {  margin-right: 0;}table[align="center"] >gt; caption[align="right"] {  margin-left: 0;}tr {  display: table-row;  vertical-align: inherit;}col {  display: table-column;}colgroup {  display: table-column-group;}tbody {  display: table-row-group;  vertical-align: middle;}thead {  display: table-header-group;  vertical-align: middle;}tfoot {  display: table-footer-group;  vertical-align: middle;}/* for XHTML tables without tbody */table >gt; tr {  vertical-align: middle;}td {  display: table-cell;  vertical-align: inherit;  text-align: inherit;  padding: 1px;}th {  display: table-cell;  vertical-align: inherit;  font-weight: bold;  padding: 1px;}tr >gt; form:-moz-is-html, tbody >gt; form:-moz-is-html,thead >gt; form:-moz-is-html, tfoot >gt; form:-moz-is-html,table >gt; form:-moz-is-html {  /* Important: don’t show these forms in HTML */  display: none !important;}/* inlines */q:before {  content: open-quote;}q:after {  content: close-quote;}b, strong {  font-weight: bolder;}i, cite, em, var, dfn {  font-style: italic;}tt, code, kbd, samp {  font-family: -moz-fixed;}u, ins {  text-decoration: underline;}s, strike, del {  text-decoration: line-through;}blink {  text-decoration: blink;}big {  font-size: larger;}small {  font-size: smaller;}sub {  vertical-align: sub;  font-size: smaller;  line-height: normal;}sup {  vertical-align: super;  font-size: smaller;  line-height: normal;}nobr {  white-space: nowrap;}/* titles */abbr[title], acronym[title] {  border-bottom: dotted 1px;}/* lists */ul, menu, dir {  display: block;  list-style-type: disc;  margin: 1em 0;  -moz-padding-start: 40px;}ol {  display: block;  list-style-type: decimal;  margin: 1em 0;  -moz-padding-start: 40px;}li {  display: list-item;  /** start:Firefox2 **/  -moz-float-edge: margin-box;  /** end:Firefox2 **/}/* nested lists have no top/bottom margins */ul ul,   ul ol,   ul dir,   ul menu,   ul dl,ol ul,   ol ol,   ol dir,   ol menu,   ol dl,dir ul,  dir ol,  dir dir,  dir menu,  dir dl,menu ul, menu ol, menu dir, menu menu, menu dl,dl ul,   dl ol,   dl dir,   dl menu,   dl dl {  margin-top: 0;  margin-bottom: 0;}/* 2 deep unordered lists use a circle */ol ul,   ul ul,   menu ul,   dir ul,ol menu, ul menu, menu menu, dir menu,ol dir,  ul dir,  menu dir,  dir dir {  list-style-type: circle;}/* 3 deep (or more) unordered lists use a square */ol ol ul,     ol ul ul,     ol menu ul,     ol dir ul,ol ol menu,   ol ul menu,   ol menu menu,   ol dir menu,ol ol dir,    ol ul dir,    ol menu dir,    ol dir dir,ul ol ul,     ul ul ul,     ul menu ul,     ul dir ul,ul ol menu,   ul ul menu,   ul menu menu,   ul dir menu,ul ol dir,    ul ul dir,    ul menu dir,    ul dir dir,menu ol ul,   menu ul ul,   menu menu ul,   menu dir ul,menu ol menu, menu ul menu, menu menu menu, menu dir menu,menu ol dir,  menu ul dir,  menu menu dir,  menu dir dir,dir ol ul,    dir ul ul,    dir menu ul,    dir dir ul,dir ol menu,  dir ul menu,  dir menu menu,  dir dir menu,dir ol dir,   dir ul dir,   dir menu dir,   dir dir dir {  list-style-type: square;}/* leafs *//*

虽然CSS2.1的附录里给了HTML4默认样式的建议(Appendix D. Default style sheet for HTML 4),这本身就不是一个很完美的解决方案,加上各个浏览器附加上一点自己私有的属性,Firefox默认样式表中清楚的说明了这点,导致了各个浏览器的默认样式表不尽相同,比如对比这份参考CSS2.1的对HTML4默认样式的建议通过实践总结出来的IE6的默认样式表(INTERNET EXPLORER 6 DEFAULT STYLE SHEET)。解决这个问题的常见方法就是通过一个通用的CSS文件来重置HTML标签的样式,使其在各个浏览器中表现的一样,比如YUI Reset CSS和Eric Meyer的CSS Tools: Reset CSS就是很好的解决方案。

扩展阅读:Really Undoing html.css - Eric Meyer

0
投稿

猜你喜欢

  • 格式请使用 gif 或 jpg 或swf (flash)同一组广告请使用一种格式。命名命名方式:宽x高.图片格式x 必须小写 ; 图片格式
  • slice 可以用来获取数组片段,它返回新数组,不会修改原数组。除了正常用法,slice 经常用来将 array-like 对象转换为 tr
  • 我来讲解属性部分, 这是相当有用的, 可要认真上课.首先,jquery中对html标签属性进行操作的关键词是 attr .没错,就4个字母,
  • CSS2.1 中规定了关于 CSS 规则 Specificity(特异性)的计算方式,用一个四位的数字串(注:CSS2 中是用三位)来表示,
  •     使用库元素必须首先在DW中正确建立站点。 库被设计用来使重复性的工作更快、更容易并尽可能地无差错。 任
  • 那么,现在如果给出一个权限编号,要去检索出用后这个权限的用户集合,就会需要在逗号分隔的多个权限编号中去匹配给出的这个权限编号。如果使用lik
  • 应原书编辑要求,先在文章顶部给出链接:《Everything You Know About CSS Is Wrong》http://www.
  • 首先要解释一下:“极致之美”不是说月儿的这篇文章,因为本人还没有自大到这种程度:P,它形容的是Lisp和javascript结合的优美形态。
  • MySQL安全性指南(3) 作 者: 晏子2.4 不用GRANT设置用户如果你有一个早于3.22.11的MySQL版本,你不能使用GRANT
  • 摘要:现代网站和web应用程序趋向于依赖客户端的大量的javascript来提供丰富的交互。特别是通过不刷新页面的异步请求来返回数据或从服务
  • 其实不光是上面描述的情况会锁住表,还有很多种场景会使表放生死锁,解锁其实很简单,下面用一个示例来讲解: 1 首先创建一个测试用的表: 代码如
  • CREATE TABLE table1( [ID] [bigint] IDENTITY(1,1) NOT NULL, [Name] [nva
  • asp取得字段属性代码:set AdoX = server.createobject("adox.c
  • BOF 指示当前记录位置位于 Recordset 对象的第一个记录之前。EOF 指示当前记录位置位于 Recordset 对象的最后一个记录
  • 众所周知,随着数据库体积的日益庞大,其备份文件的大小也水涨船高。虽然说通过差异备份与完全备份配套策略,可以大大的减小SQL Server数据
  • ORA-00600:internal error code,arguments:[num],[?],[?],[?],[?]产生原因:这种错误
  • 但Insus.NET想到的是,从下面的SQL语句,就可以查询到数据库大小。因此分享于此。  代码如下:SELECT DB_NAME
  • 在Perfection kills上看到他去年写的一篇文章,关于HTML优化的,讲的很详细,姑且记录之,尽管里面有些东西并不能在目前的环境里
  • 在使用操作XML文件时,我们可以使用Load方法直接加载xml文件即可,在ie和ff下通用。但是是XML字符串,则在两种浏览器下就会有所不同
  • 不知道从什么时候开始,在网络上到处可以看到div+css,到底什么是div+css呢?难道就是传说中的标准重构吗?标准从最简单的根源来说不是
手机版 网络编程 asp之家 www.aspxhome.com