sábado, 25 de julio de 2020

Ejercicio listas y listas anidadas HTML.

Listas ordenadas y no ordenadas

Listas "No" Ordenadas.

  • Primer elemento.
  • Segundo elemento.
  • Tercero elemento.
  • Cuarto elemento.

Listas Ordenadas.

  1. Primer Elemento.
  2. Segundo Elemento.
  3. Tercer Elemento.
  4. Cuarto Elemento.

Listas Ordenadas Con Letras

  1. Primer Elemento.
  2. Segundo Elemento.
  3. Tercer Elemento.
  4. Cuarto Elemento

Listas Ordenadas Con Atributo "start".

  1. Primer Elemento.
  2. Segundo Elemento.
  3. Tercer Elemento.
  4. Cuarto Elemento

Listas De Letras Con Atributo "Reversed".

  1. Primer Elemento.
  2. Segundo Elemento.
  3. Tercer Elemento.
  4. Cuarto Elemento

Sangrias Atributos dl,dt y dd.

HTML
HyperText Markup Language
HTTP
HyperText transfer Protocol
URL
Uniform Resource Locator

Ejemplo De Sangria o Margen Izquierdo.

Politico
Perteneciente o relativo a la doctrina de la politica.
Dicho de una persona:Que interviene en las cosas del gobierno y negocios del estado.
Corrupto
Que se deja o ha dejado sobornar, pervertir o viciar.
Sinvergüenza
Pícaro, bribón.
Dicho de una persona:Que comente actos ilegales en provecho propio, o que incurre en inmoralidades.

Listas anidadas.

  • Lista de Primer Nivel:
    • Lista de Segundo Nivel:
      • Lista de Tercer Nivel la última.

Otro Ejemplo de listas anidadas.

  • Números cardinales:
    1. Uno
    2. Dos
    3. Tres
  • Números Ordinales:
    1. Primero
    2. Segundo
    3. Tercero

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Listas ordenadas y no ordenadas</title>
</head>
<body>
    <h2>Listas "No" Ordenadas.</h2>
    <ul>
        <li>Primer elemento.</li>
        <li>Segundo elemento.</li>
        <li>Tercero elemento.</li>
        <li>Cuarto elemento.</li>
    </ul>
    <h2> Listas Ordenadas.</h2>
    <ol>
        <li>Primer Elemento.</li>
        <li>Segundo Elemento.</li>
        <li>Tercer Elemento.</li>
        <li>Cuarto Elemento.</li>
    </ol>
    <h2>Listas Ordenadas Con Letras</h2>
    <ol type="A">
        <li>Primer Elemento.</li>
        <li>Segundo Elemento.</li>
        <li>Tercer Elemento.</li>
        <li>Cuarto Elemento</li>
    </ol>
    <h2>Listas Ordenadas Con Atributo "start".</h2>
    <ol start="7">
        <li>Primer Elemento.</li>
        <li>Segundo Elemento.</li>
        <li>Tercer Elemento.</li>
        <li>Cuarto Elemento</li>
    </ol>
    <h2>Listas De Letras Con Atributo "Reversed".</h2>
    <ol type="A" reversed>
        <li>Primer Elemento.</li>
        <li>Segundo Elemento.</li>
        <li>Tercer Elemento.</li>
        <li>Cuarto Elemento</li>
    </ol>
    <h2>Sangrias Atributos dl,dt y dd.</h2>
    <dl>
        <dt>HTML</dt>
        <dd>HyperText Markup Language</dd>
        <dt>HTTP</dt>
        <dd>HyperText transfer Protocol</dd>
        <dt>URL</dt>
        <dd>Uniform Resource Locator</dd>
    </dl>
    <h2>Ejemplo De Sangria o Margen Izquierdo.</h2>
    <dl>
        <dt>Politico</dt>
        <dd>Perteneciente o relativo a la doctrina de la politica.</dd>
        <dd>Dicho de una persona:Que interviene en las cosas del gobierno y negocios del estado.</dd>
        <dt>Corrupto</dt>
        <dd>Que se deja o ha dejado sobornar, pervertir o viciar.</dd>
        <dt>Sinvergüenza</dt>
        <dd>Pícaro, bribón.</dd>
        <dd>Dicho de una persona:Que comente actos ilegales en provecho propio, o que incurre en inmoralidades.</dd>
    </dl>
    <h2>Listas anidadas.</h2>
    <ul>
        <li>Lista de Primer Nivel:</li>
        <ul>
            <li>Lista de Segundo Nivel:</li>
            <ul>
                <li>Lista de Tercer Nivel la última.</li>
            </ul>
        </ul>
    </ul>
    <h2>Otro Ejemplo de listas anidadas.</h2>
    <ul>
        <li>Números cardinales:</li>
         <ol>
             <li>Uno</li>
             <li>Dos</li>
             <li>Tres</li>
         </ol>
         <li>Números Ordinales:</li>
         <ol type="A">
             <li>Primero</li>
             <li>Segundo</li>
             <li>Tercero</li>
         </ol>
    </ul>
</body>
</html>

Calculadora HTML / CSS / JS

See the Pen MWyzKmv by Fabian Albarracin ( @fabianalbarracin ) on CodePen .