https://github.com/natserract/haml-zero-to-hero
Learn HAML from scratch
https://github.com/natserract/haml-zero-to-hero
haml html html5 learning tutorial
Last synced: 6 months ago
JSON representation
Learn HAML from scratch
- Host: GitHub
- URL: https://github.com/natserract/haml-zero-to-hero
- Owner: natserract
- Created: 2019-12-14T02:15:15.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2019-12-14T02:16:45.000Z (over 6 years ago)
- Last Synced: 2025-02-09T18:44:39.586Z (over 1 year ago)
- Topics: haml, html, html5, learning, tutorial
- Language: HTML
- Size: 7.81 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# HAML (HTML Abstraction Markup Language) - HTML Preprocessors
Haml is a templating engine for HTML. It's designed to make it both easier and more pleasant to write HTML documents, by eliminating redundancy, reflecting the underlying structure that the document represents, and providing an elegant syntax that's both powerful and easy to understand.
## Basic Usage
Haml can be used from the command line or as part of a Ruby web framework. The
first step is to install the gem:
~~~sh
gem install haml
~~~
After you write some Haml, you can run
~~~sh
haml document.haml
~~~
to compile it to HTML. For more information on these commands, check out
~~~sh
haml --help
~~~
## Formatting
The most basic element of Haml is a shorthand for creating HTML:
~~~haml
%tagname{:attr1 => 'value1', :attr2 => 'value2'} Contents
~~~
No end-tag is needed; Haml handles that automatically. If you prefer HTML-style
attributes, you can also use:
~~~haml
%tagname(attr1='value1' attr2='value2') Contents
~~~
Adding `class` and `id` attributes is even easier. Haml uses the same syntax as
the CSS that styles the document:
~~~haml
%tagname#id.class
~~~