Haml Overview and Details
!!! 5
%html{lang: 'en'}
%head
%title Output Wrangling
%body
%h2<
%span Remove whitespace in a tag
%h2
%span Remove
%span> whitespace around
%span a tag
%h2
Evaluate multiple lines |
as one with the pipe character |
!!! 5
%html{lang: 'en'}
%head
%title Sample Haml
%body
%h1 Archaeopteryx
!!! 5
%html{lang: 'en'}
%head
%title Filters
%body
:javascript
$('.dinosaur').on('click', function(e) {
alert('rawr');
});
!!! 5
%html{lang: 'en'}
%head
%title Content Formatting
%body
%p
Visit a local
%em Museum
or a
%em Science Institute
%p Visit a local <em>Museum</em> or a <em>Science Institute</em>
:markdown
Visit a local *Museum* or a *Science Institute*
!!! 5
%html
!!! 5
%html{lang: 'en'}
%head
%title Nesting
%body
%h1 Gallimimus
%h2
Cretaceous Period
%h3
%strong Discovered in 1963
!!! 5
%html{lang: 'en'}
%head
%title Adding Ruby
%body
- title = 'Stegosaurus'
%h1= title
!!! 5
%html{lang: 'en'}
%head
%title IDs, Classes, Divs
%body
%section#content.container
.stats.container
!!! 5
%html{lang: 'en'}
%head
%title Attributes
%body
%a{href: 'http://en.wikipedia.org/wiki/Spinosaurus', title: 'Spinosaurus'} Spinosaurus
%a(href="http://en.wikipedia.org/wiki/Spinosaurus" title="Spinosaurus") Spinosaurus
!!! 5
%html{lang: 'en'}
%head
%title Adding Ruby II
%body
- title = 'Pterodactyl'
- if title == 'Stegosaurus'
%h2 The Greatest Dinosaur Ever
- else
%h2 Some Random Dinosaur
!!! 5
%html{lang: 'en'}
%head
%title Nesting Errors
%body
-# Returns with an error: content is on the same line and nested inside
%h4 Max Height:
%em 9m
-# Returns with an error: inconsistent indentation
%p
Present in the same period as the
%span Tyrannosaurus