<p><a href="javascript:abrirV01()">Ver ventana flotante en acción</a></p>
<div class="ventanaFlotante" id="ventanaV01">
<div class="VFcerrar"><a href="javascript:cerrarV01()"><svg><use href="#iconosvg-limpiar"></use></svg></a></div>
<div>ventanaFlotanteI</div>
</div>

<table class="tablaCebrada">
    <tr><th>Columnas/Lineas</th><th>Columna 1</th><th>Columna 2</th></tr>
    <tr><th>Linea 1</th><td>XX</td><td>XX</td></tr>
    <tr><th>Linea 2</th><td>XX</td><td>XX</td></tr>
    <tr><th>Linea 3</th><td>XX</td><td>XX</td></tr>
    <tr><th>Linea 4</th><td>XX</td><td>XX</td></tr>
</table>

<table class="tablaCebrada tablaCebrada-posicion">
    <tr><th>Columnas/Lineas</th><th>Columna 1</th><th>Columna 2</th></tr>
    <tr><th>Linea 1</th><td>XX</td><td>XX</td></tr>
    <tr><th>Linea 2</th><td>XX</td><td>XX</td></tr>
    <tr><th>Linea 3</th><td>XX</td><td>XX</td></tr>
    <tr><th>Linea 4</th><td>XX</td><td>XX</td></tr>
</table>

<ul>
    <li>En azul con la clase <span class="resaltaAz">.resaltaAz</span> con <span class="resaltaAz"><a href="#Az">un enlace</a></span></li>
    <li>En amarillo con la clase <span class="resaltaAm">.resaltaAm</span> con <span class="resaltaAm"><a href="#Am">un enlace</a></span></li>
    <li>En gris con la clase <span class="resaltaGr">.resaltaGr</span> con <span class="resaltaGr"><a href="#Gr">un enlace</a></span></li>
    <li>En rojo con la clase <span class="resaltaRo">.resaltaRo</span> con <span class="resaltaRo"><a href="#Ro">un enlace</a></span></li>
    <li>En verde con la clase <span class="resaltaVe">.resaltaVe</span> con <span class="resaltaVe"><a href="#Ve">un enlace</a></span></li>
<ul>

<a href="#Botón-flotante" class="bton2 bton2-verde2 flotante">Botón flotante</a>
<a href="#Botón-flotante" class="bton2 bton2-verde2">Botón no flotante</a>

<input type="submit" value="" name="submit">

<ul id="ListDeTooltips">
    <li><i>Aragua</i><span>Maracay</span></li>
    <li><i>Carabobo</i><span>Valencia</span></li>
    <li><i>Miranda</i><span>Los Teques</span></li>
    <li><i>Merida</i><span>Merida</span></li>
    <li><i>Tachira</i><span>San Cristobal</span></li>
    <li><i>Yaracuy</i><span>San Felipe</span></li>
</ul>

<etiqueta class="tooltipCont">
    <i>Texto o contenido</i>
    <span  class="tooltip tooltip-top">Contenido a mostrar</span>
</etiqueta>

<div>
    <label for="nombre">Nombre:</label>
    <input type="text" name="nombre" id="nombre">
    <a href="#a" class="hintanchor" onMouseover="showhint('<span>Nombre:</span><br>Introduzca su nombre.', this, event, '150px')">[?]</a>
    <br>
    <label for="password">Password:</label>
    <input type="password" name="password" id="password">
    <a href="#b" class="hintanchor" onMouseover="showhint('<span>Password:</span><br>Introduzca la contraseña deseada.<br>Debe ser de 8 caracteres o más.', this, event, '200px')">[?]</a>
</div>

<h1 id="logo"> <a href="#">Tironemota.com</a> </h1>

<form>
    <input name="busca" type="text" id="busca" placeholder="Buscar ..." size="40">
</form>

<select id="Seleccionar" onchange="SelectPais(this.id);">
    <option value="">Selecciona..</option>
    <option value="Colombia">Colombia</option>
    <option value="Brasil">Brasil</option>
    <option value="Venezuela">Venezuela</option>
</select>
<input type="text" name="Pais" id="Pais" />

Escriba dentro de este campo: <input id="InputText1" type="text" onkeyup="Ejemplo1();" />
<br><br>
El valor introducido se reflejará aquí: <input type="text" disabled id="InputText2" />

<form id="form1" action="#">
    <select id="texto" onClick="cambiarContenido( getElementById('texto').value );">
        <option value="ninguno">Seleccione..</option>
        <option value="Primer ejemplo">Primer ejemplo</option>
        <option value="Segundo ejemplo">Segundo ejemplo</option>
    </select>
</form>
<div>Contenido de mi capa...<span id="micapa">ninguno</span></div>

<form action="#" id="form2">
    <select id="texto2" onClick="cambiarContenido2( getElementById('texto2').value );">
        <option value="....">MARCA</option>
        <option value="Ford">Ford</option>
        <option value="Chevrolet">Chevrolet</option>
        <option value="Fiat">Fiat</option>
    </select>
    <select id="texto3" onClick="cambiarContenido3( getElementById('texto3').value );">
        <option value="....">COLOR</option>
        <option value="Negro">Negro</option>
        <option value="Blanco">Blanco</option>
        <option value="Rojo">Rojo</option>
    </select>
    <select id="texto4" onClick="cambiarContenido4( getElementById('texto4').value );">
        <option value="....">TIPO</option>
        <option value="Sedan">Sedan</option>
        <option value="Camioneta">Camioneta</option>
    </select>
</form>
<div>Mi vehiculo es un <span id="micapa2">....</span> de color <span id="micapa3">....</span> tipo <span id="micapa4">....</span></div>

<textarea onclick="this.select()">
    Seleccionar contenido de una textarea al hacer click
</textarea>

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Ejemplo</title>
    <style>
    html,
    body {
        height: 100%;
        margin: 0;
    }
    .container {
        height: 100%;
        display: flex;
        flex-direction: column;
    }
    .container > div {padding:10px;}
    .container > div:last-child {
        background-color: tomato;
        flex: 1;
    }
    </style>
</head>

<body>
    <div class="container">
        <div>Div 1</div>
        <div>Div 2</div>
        <div>Div 3</div>
    </div>
</body>
</html>

<table>
    <thead>
        <tr style="background:#333232;color:#F1F0F0">
            <th style="text-align:center;width:30px;"><input name="todoscheck" type="checkbox" /></th>
            <th style="text-align:center;width:30px;">ID</th>
            <th style="width:100px;">Nombre</th>
            <th style="width:200px;">Comentario</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td style="text-align:center;width:30px;"><input name="comment-1" type="checkbox" /></td>
            <td style="text-align:center;width:30px;">1</td>
            <td style="width:100px;">Juan Perez</td>
            <td style="width:200px;">Texto de comentario</td>
        </tr>
        <tr>
            <td style="text-align:center;width:30px;"><input name="comment-2" type="checkbox" /></td>
            <td style="text-align:center;width:30px;">2</td>
            <td style="width:100px;">Juan Perez</td>
            <td style="width:200px;">Texto de comentario</td>
        </tr>
    </tbody>
</table>

<div class="ListaContador">
    <ol>
        <li>Item 1</li>
        <li>Item 2
            <ol>
                <li>Item 2-1</li>
                <li>Item 2-2</li>
            </ol>
        </li>
        <li>Item 3
            <ol>
                <li>Item 3-1</li>
                <li>Item 3-2</li>
                <li>Item 3-3
                    <ol>
                        <li>Item 3-3-1</li>
                        <li>Item 3-3-2</li>
                    </ol>
                </li>
            </ol>
        </li>
    </ol>
</div>