W3C home > Mailing lists > Public > www-style@w3.org > April 2012

Re: [css-variables] Adding a default value to var()

From: Chris Eppstein <chris@eppsteins.net>
Date: Mon, 2 Apr 2012 23:00:56 -0700
Message-ID: <CANyEp6VVq5m9TS=Gd2r7+S42MVxjqiHLQWFZysou6EFO0g7rpQ@mail.gmail.com>
To: "Tab Atkins Jr." <jackalmage@gmail.com>
Cc: www-style list <www-style@w3.org>
Well if you do need defaults, I suggest that you do it using guarded
assignment like we do in Sass, instead of at read time -- the point is to
to eliminate duplication :P

:root {
  var-user-bg-color: blue;
:root {
  var-user-bg-color: black !default;
body {
  background-color: var(user-bg-color) /* blue */;


On Mon, Apr 2, 2012 at 10:33 PM, Tab Atkins Jr. <jackalmage@gmail.com>wrote:

> On Mon, Apr 2, 2012 at 8:24 PM, Chris Eppstein <chris@eppsteins.net>
> wrote:
> > We have default values for variables in Sass, but I do not think they are
> > necessary in CSS variables because the value is resolved after the
> cascade
> > is applied. As such, you can set the value to the default value and the
> > consumer of the "themeable" stylesheet can always override that value if
> > they choose to in their own stylesheets.
> The problem with that is that they need to ensure that their rule wins
> in the cascade, which isn't always trivial.  In some cases, such as
> Web Components, it may even be impossible, since you can't target
> selectors into the component (it's intended that inheritance will
> transfer variables from the component's root into the shadow tree,
> where they can be used in styles).
> That's also not an option if we try to merge Variables and SVG
> parameters, since the "provider" of the explicit variable values isn't
> using a stylesheet to do it at all.
> ~TJ
Received on Tuesday, 3 April 2012 06:01:25 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:38:57 UTC