Frontend Training

Basic HTML Elements

Headings

h1. Header 1

<h1>h1. Header 1</h1>

h2. Header 2

<h2>h2. Header 2</h2>

h3. Header 3

<h3>h3. Header 3</h3>

h4. Header 4

<h4>h4. Header 4</h4>
h5. Header 5
<h5>h5. Header 5</h5>
h6. Header 6
<h6>h6. Header 6</h6>

Paragraphs

This paragraph is aligned to the left. 


                <p class="align-left">
                    This paragraph is aligned to the left.
                </p>

This paragraph is aligned to the center. 


                <p class="align-center">
                    This paragraph is aligned to the center.
                </p>

This paragraph is aligned to the right. 


                <p class="align-right">
                    This paragraph is aligned to the right.
                </p>

Forms


                <form>
                    <input type="text" placeholder="Usuario">
                    <input type="password" placeholder="Contraseña">
                    <select name="select">
                        <option value="1">Uno</option>
                        <option value="2">Dos</option>
                        <option value="3">Tres</option>
                    </select>
                    <label><input type="radio" name="gender" value="male" checked> Male</label>
                    <label><input type="radio" name="gender" value="female"> Female</label>
                    <label><input type="radio" name="gender" value="other"> Other</label>
                </form>

Otros elementos comunes

Link 


                <a href="#other">
                    Link
                </a>
            

                <ul>
                    <li>Uno</li>
                    <li>Dos</li>
                    <li>Tres</li>
                </ul>
Ricardo Fort HTML Tatoo 

                <img src="http://66.media.tumblr.com/aea79d3c26acdcfe325e94c7ae251717/tumblr_inline_nqmfxalvCS1qk1op9_500.gif" alt="Ricardo Fort">
                <img src="html_tat.jpg" alt="HTML Tatoo">
Esto es un <div> con un <span>. 

                <div>
                    Esto es un <span>&lt;div&gt;</span> con un <span>&lt;span&gt;</span>.
                </div>