Book Image

Web Development with Jade

By : Sean Lang
Book Image

Web Development with Jade

By: Sean Lang

Overview of this book

Table of Contents (16 chapters)

Block expansion

When each tag only has one tag nested under it, it can be a little annoying to have a new line for each one of them:

    a(href='#') foo
    a(href='#') bar
    a(href='#') baz

So, Jade has a feature called block expansion that lets us put those tags on the same line, meaning we can rewrite the preceding example as the following:

  li.first: a(href='#') foo
  li: a(href='#') bar
  li.last: a(href='#') baz

The : (colon) after the tag name and attributes indicates that there is another tag following that one. We can even make really long chains of tags:



ul: li.first: b: a(href='#') foo
  <li class="first">
      <a href="#">foo</a>

But that is really hard to read, so please, never do that unless you have a very good reason.