Nested Inline Elements with Jade

I'm trying to make this chunck html code correctly in jade

<h1>Hello<small> world</small></h1> 

Unfortunately, everything I tried does not work.

I tried installing small inline, but it does not work. I tried to put the small one in a new line, but in this case the small one is not nested in the h1 tags

+7
pug
source share
3 answers

I found this solution and it works. Starting with Jade 1.0 nested inline tags are supported

 h1 Hello #[small world] 
+17
source share

Starting in Jade 1.0 , around December 2013, inline tags are supported using the following syntax:

#[tag(attribute='value') lorem ipsum]

Using your HTML example:

 <h1>Hello <small>world</small></h1> 

It can be rewritten in Jade as:

 h1 Hello #[small world] 

Although it's not as popular - and certainly not better - you can also mix maximum Jade tags with plain HTML, for example:

 h1 Hello <small>world</small> 

Jade Playground is a great place to try out new technologies!

+6
source share

Besides the built-in elements, you can also use HTML chunks after using the syntax for generating the first jade. So

 h1 Hello <small>world</small> 

will also be displayed as

 <h1>Hello <small>world</small></h1> 
+4
source share

All Articles