Skip to content

using CSS

Use h1,h2,h3,h4,h5,h6 {foo:bar} to apply the foo:bar declaration to HTML heading elements at all six levels.

There is no way to block inheritance of styles in CSS. Inheritance is related to cascading, and cascading is intrinsic to CSS.

There is currently no way to select the parent of an element in CSS.

pseudo-classes

:has()

According to the MDN wiki, the :has() CSS pseudo-class represents an element if any of the selectors passed as parameters (relative to the :scope of the given element), match at least one element.

The :has() pseudo-class takes a selector list as an argument. In the current specification :has is not marked as part of the live selector profile, which means it can not be used within stylesheets; only with functions like document.querySelector().

/* Selects any <a>, as long as it has an <img> element directly inside it  */
/* Note that this is not supported in any browser yet */
/* It also isn't intended to work in stylesheets */
var test = document.querySelector('a:has(> img)');

preprocessors

Less

According to Wikipedia, Less is a dynamic preprocessor style sheet language that can be compiled into Cascading Style Sheets (CSS) and run on the client side or server side.1

Sass

According to Wikipedia, Sass is a preprocessor scripting language that is interpreted or compiled into Cascading Style Sheets (CSS). SassScript is the scripting language itself. Sass consists of two syntaxes. The original syntax, called "the indented syntax", uses a syntax similar to Haml.2 It uses indentation to separate code blocks and newline characters to separate rules. The newer syntax, "SCSS" (Sassy CSS), uses block formatting like that of CSS. It uses braces to denote code blocks and semicolons to separate lines within a block. The indented syntax and SCSS files are traditionally given the extensions .sass and .scss, respectively.

Bourbon

Bourbon is a library of Sass mixins and functions that are designed to make you a more efficient style sheet author.

Compass

Compass is a deprecated3 CSS preprocessor that uses Sass.

Stylus

Stylus is a CSS preprocessor that supports both an indented syntax and regular CSS style.

licensing

Some rights reserved: CC BY-SA 3.0. Includes significant content from:

MIT License for Bourbon4

The MIT License (MIT)

Copyright © 2011-2018 thoughtbot, inc.

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

(The MIT License)

Copyright (c) Automattic

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the 'Software'), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

MIT License for Stylus5

(The MIT License)

Copyright (c) Automattic

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the 'Software'), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

prior work

  1. Official Less website Official Less website ↩

  2. Media Mark (3.2.12). "Sass - Syntactically Awesome Stylesheets". Sass-lang.com. Retrieved 2014-02-23. ↩

  3. https://github.com/Compass/compass/blob/stable/README.markdown ↩

  4. https://github.com/thoughtbot/bourbon/blob/master/LICENSE.md ↩

  5. https://github.com/stylus/stylus/blob/dev/LICENSE ↩