4

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

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

例如,我想可以创建一个 CSS 类,它包含 CSS 规范定义的每个属性,并将它们设置为规范指定的初始值。是否有一个 CSS 类已经可以做到这一点?

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

4

3 回答 3

5

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

all: initial根据定义,不能跨浏览器,因为:

  1. font-familyquotes取决于 UserAgent的初始值
  2. 的初始值color因浏览器而异
  3. 的初始值text-size-adjust取决于浏览器对 Inflation 的支持(虽然,它是实验性的)

更新(2017 年 3 月 1 日)

  1. 供应商的appearance属性: ( -webkit-appearance, -moz-appearance, -ms-appearance) 没有,但在 User-Agent CSS 中被覆盖。

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

  3. 属性:outline-color要么是要么currentColor倒置,取决于浏览器

text-size-adjust在初始帖子中也标记为实验性

更新(2017 年 3 月 8 日)

  1. 属性:text-alignleftright最初取决于direction,它all: initial不会根据规范覆盖。
于 2017-02-22T10:57:31.083 回答
1

initial关键字 value 于 2011 年在 Cascading and Inheritance Module 中引入——在 FF 19+、Chrome、Safari、Opera 15+ 中受支持,但目前在任何版本的 IE 中都不支持。

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

于 2015-08-11T08:32:33.460 回答
0

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

它可以通过手动设置初始值来修复浏览器的不一致。但这是一个悬而未决的问题,它是否面向未来。但是在你使用插件之前,你会得到相同的结果。

于 2017-02-22T11:02:10.950 回答