Skip to content
padolsey edited this page Mar 16, 2013 · 3 revisions

An attribute is a property and value that'll be included in the generated HTML output.

CSS Attribute selectors:

Attributes can be defined within an element's selector:

a[href='http://example.com'] {
  //...
}

Some other examples:

input[type=checkbox]           // <input type="checkbox" />
textarea[disabled]             // <textarea disabled></textarea>
style[scoped][type='text/css'] // <style type="text/css" scoped></style>

Regular attributes:

a {
  href: 'http://example.com';
}

Syntax variations for name:value;

The general structure is:

name: value;

The spacing between punctuation is up to you:

name  : value ;

A value can be a:

  • String: "foo", 'foo', 'foo\'s'
  • Number: 1234
  • SimpleString: [a-zA-Z0-9]+, e.g. type:text;

The semi-colon is optional, but should be used if you're defining that may be misinterpreted. For example:

value:12

You should add a semi-colon and/or wrap 12 in quotes, otherwise it'll parsed as a value tag with a pseudo-class multiplier of 12.