Skip to content

royjulien/STCSS

master
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
css
 
 
 
 
js
 
 
 
 
 
 
 
 

#STCSS

Welcome to STCSS - Style The Cascading Style Sheets!

STCSS is a new standard for formatting CSS. It indents your CSS selectors based on your DOM making it easy for developers to read and know how each CSS selector is nested.


How does it work?

STCSS is now in Beta. Live Demo

  • Download the project
  • Launch index.html in any browser
  • Either paste your HTML in the HTML box or start typing

Tada, your CSS is created live and indented according to your DOM.

STCSS Formatting

You can develop your own CSS based on STCSS formatting by using the same indentation as your HTML.

HTML example:

<section id='wrapper'>
    <header id='header'>
        <h1 id='header-h1'>
            <a class='link' href='#'>Style the Styles</a>
        </h1>
        <div id='header-slogan'></div>
    </header>
</section>

Would be written:

#wrapper {}
    #header {}
        #header-h1 {}
            .link {}.link:hover {}.link:before {}
        #header-slogan {}

About

Style The Cascading Style Sheets

Resources

Stars

Watchers

Forks

Packages

No packages published