Re: dynamic states and pseudo elements for inline styles

On Wed, Nov 9, 2016 at 11:20 AM, Zack Weinberg <zackw@panix.com> wrote:
> On Wed, Nov 9, 2016 at 1:57 PM, Tab Atkins Jr. <jackalmage@gmail.com> wrote:
>>>
>>> We need to bring this up as a WICG topic; when we get implementor
>>> interest, it'll be promoted to a WICG spec; when it's mature, it'll
>>> return to the CSSWG, presumably as a new level of the style-attr spec.
>>
>> And the first step is done:
>> https://discourse.wicg.io/t/proposal-expand-inline-style-attributes-to-allow-pseudo-class-element-styling/1812
>
> I like the idea in general, but can I make a quick suggestion?  Right
> now, the contents of a style attribute are syntactically and
> functionally identical to the contents of a declaration block.  We
> could maintain that equivalence if pseudo-class/element blocks were
> allowed inside declaration blocks in general, as well as per-element
> style properties.  This would be easier to spec and implement (keep
> the existing parser entry point for style attributes, just change the
> css3-syntax definition of "consume a list of declarations"), easier to
> teach (because there isn't anything that is allowed in one place but
> not the other), and would save typing in some common cases with
> stylesheets.
>
> For example:
>
> <style>
> header > a {
>                  color: #000; text-decoration: none;
>    :visited { color: #000; text-decoration: none; }
>    :hover  { color: #222; text-decoration: underline }
> }
> </style>
> <header><a href="/">This is the Name of My Site</a></header>
>
> same as
>
> <style>
> header > a            { color: #000; text-decoration: none;
> header > a:visited { color: #000; text-decoration: none; }
> header > a:hover  { color: #222; text-decoration: underline }
> </style>
> <header><a href="/">This is the Name of My Site</a></header>
>
> same as
>
> <header><a style="
>                  color: #000; text-decoration: none;
>    :visited { color: #000; text-decoration: none; }
>    :hover  { color: #222; text-decoration: underline }
> " href="/">This is the Name of My Site</a></header>

Definitely an interesting suggestion. It's different than what naked
nesting does in CSS preprocessors, tho, and the "only
pseudo-selectors" restriction doesn't make as much sense in a
stylesheet (where you legitimately might want to style differently
based on an attribute or other feature selector).

~TJ

Received on Wednesday, 9 November 2016 19:31:00 UTC