Suggestion for Attribute Selectors (and answer to Q[lang] problem)

Hi.

We currently have
     [attr="fullvalue"]
     [attr~="wordinlist"]
in the CSS2 Working Draft. What about
     [attr?="partvalue"]
for a case (in)sensitive search of an attribute? (operator ?= could be
anything).
I have colour coded anchors/links on my web site, with in-site links in one
colour, links to other sites in another, etc... To do this, I have set up a
style sheet and use links like these:
     <A CLASS=EXTERNAL HREF="http://www.w3.org/">W3C</A>
     <A CLASS=ACADEMIC HREF="http://www.bath.ac.uk/">My ISP</A>
     <A CLASS=INTERNAL HREF="../home.html">Return to home page</A>
Using my proposal, one could simply have straight forward <A>s and use
  /* Internal Links */
     A:link                                     { color: green }
     A:visited                                  { color: lime }
  /* External Links */
     A[attr?="http://"]:link                    { color: blue }
     A[attr?="http://"]:visited                 { color: navy }
  /* UK Academic Links */
     A[attr?="http://"][attr?=".ac.uk"]:link    { color: red }
     A[attr?="http://"][attr?=".ac.uk"]:visited { color: maroon }

The advantage is that whenever you want to change the scheme (different
categories), you can... without going through the *entire* 1000+ page site,
changing the CLASS attribute on all anchors!


/* many sites have silly little envelope icons next to e-mail links... */
     A[attr?="mailto:"]   { background-image: url(mailto.png);
                            background-position: middle left;
                            background-repeat: no-repeat;
                            margin-left: 32px; }


=-=-=-=-=-=-=-=-=-

Note - in the page about generated content, there is a comment about "how do
we do language dependant quotes?".
The answer is
   [lang="fr"] Q:before, Q[lang="fr"]:before { content: '\AB' }
which copes with quotes within a language section, and quotes of a
particular language in another language's section. (unless I've missed
something important!)


=-=-=-=-=-=-=-=-=-

REFS:
CSS2 Selectors, Attribute Selectors, Matching attributes and attribute
values, 5.7.1:
http://www.w3.org/TR/1998/WD-css2-19980128/selector.html#h-5.7.1
CSS2 Generated Content: Section 11.1
http://www.w3.org/TR/1998/WD-css2-19980128/generate.html#before-after-conten
t
My Web Site (with colour coded links):
http://www.bath.ac.uk/~exxieh/


--
Ian Hickson
-----BEGIN GEEK CODE BLOCK-----
Version: 3.12
GIT/M/S d- s+: a--- C++(+++)>$ U P L+ !E W++ N++ o? K? w++>+++ O- !M V- PS+
PE- Y+ PGP t 5+++>++++ X- R+++ tv b++(+++) DI D++ G e-(*)>+++++ h!()(--) y?
------END GEEK CODE BLOCK------

Received on Saturday, 7 March 1998 07:22:20 UTC