跨浏览器版“all:initial”

时间:2015-08-11 08:25:26

标签: javascript html css css3 css-reset

我正在尝试使用all: initial来隔离页面中特殊“小部件”的CSS。问题是Safari和IE10及更早版本不支持all属性,IE不支持initial值。

有没有办法使用CSS或JavaScript模拟相同的行为?

例如,我想可以创建一个CSS类,它包含CSS规范定义的每个属性,并将它们设置为spec指定的初始值。那里有一个已经做过的CSS课吗?

如果我谷歌“CSS重置”我得到一堆样式表,专门用于规范用户代理样式表之间的差异,这与all: initial不同。

3 个答案:

答案 0 :(得分:5)

即使所有浏览器都支持all: initial,它也不会是跨浏览器。

根据定义,

all: initial不能跨浏览器,因为:

  1. font-familyquotes的初始值取决于UserAgent
  2. color的初始值因“浏览器到浏览器”而异。
  3. text-size-adjust的初始值取决于浏览器对Inflation 的支持(尽管,其实验性)
  4. 更新(2017年3月1日):

    1. 厂商' appearance属性:(-webkit-appearance-moz-appearance-ms-appearance)为none,但在用户代理CSS中被覆盖。

    2. 14个属性的列表取决于currentcolor,它是对属性color的引用,因浏览器而异(因此第2点),上述列表为:{{1} },-webkit-border-before-color-webkit-text-fill-color-webkit-text-stroke-colorborder-block-end-colorborder-block-start-colorborder-bottom-colorborder-inline-end-colorborder-inline-start-colorborder-left-colorborder-right-colorborder-top-colorcolumn-rule-colortext-decoration-color

    3. 属性:text-emphasis-coloroutline-color或倒置的,取决于浏览器

    4. 还在初始帖子中将currentColor标记为实验

      更新(2017年3月8日):

      1. 属性:text-size-adjust最初为text-alignleft,取决于rightdirection不会相应地覆盖规范。

答案 1 :(得分:1)

initial关键字值是2011年在Cascading and Inheritance Module中引入的 - 它在FF 19 +,Chrome,Safari,Opera 15+中得到支持,但在任何版本的IE中均为currently not supported

这与此目的没有同义词。您唯一的解决方案是信任规范化器或根据浏览器手工制作所有属性和值(非常努力)

答案 2 :(得分:0)

此PostCSS插件可以提供帮助:postcss-initial

它可以通过手动设置初始值来修复浏览器的不一致性。但这是一个悬而未决的问题,是否具有前瞻性。但是在使用插件之前,您将获得相同的结果。