Tecnosoluciones

Cosas básicas
aprendidas en Clase:D

Este es un título principal


<h1> Este es un título principal </h1>
    

Este es un subtítulo


<h2> Este es un subtitulo </h2>
    

Esta página tiene un fondo color gris claro con <style> en CSS:


body {
  background: #f2f2f2;
}
    

Este es un párrafo de texto.


<p> Este es un párrafo de texto. </p>
    

Este es un texto con un enlace.


<a href="https://www.ejemplo.com">Este es un texto con un enlace</a>
    

Imagen sobre esta página

Esta es una imagen con medidas de 573x342.


<img src="TecnoSoluciones.png" alt="Imagen sobre esta página">
<p> Esta es una imagen con medidas de 573x342 </p>
    

Aquí hay dos listas:

Lista ordenada:

  1. Primer elemento
  2. Segundo elemento
  3. Tercer elemento

<ol>
  <li>Primer elemento</li>
  <li>Segundo elemento</li>
  <li>Tercer elemento</li>
</ol>
    

Lista desordenada:


<ul>
  <li>Manzanas</li>
  <li>Plátanos</li>
  <li>Naranjas</li>
</ul>
    

Ejemplo de tabla

Encabezado 1 Encabezado 2
Celda 1 Celda 2

<table>
  <tr>
    <th>Encabezado 1</th>
    <th>Encabezado 2</th>
  </tr>
  <tr>
    <td>Celda 1</td>
    <td>Celda 2</td>
  </tr>
</table>
    

Esta es una lista con Una opcion de selección



<label for="frutas">Selecciona tus frutas favoritas:</label>
<select id="frutas" name="frutas">
  <option value="manzana">Manzana</option>
  <option value="platano">Plátano</option>
  <option value="fresa">Fresa</option>
  <option value="naranja">Naranja</option>
</select>
    

Esta es una lista con Casillas de verificación


 
<label for="frutas">Selecciona tus frutas favoritas:</label>
<input type="checkbox" id="manzana" name="frutas" value="manzana">
<label for="manzana">Manzana</label>
<input type="checkbox" id="platano" name="frutas" value="platano">
<label for="platano">Plátano</label>
<input type="checkbox" id="fresa" name="frutas" value="fresa">
<label for="fresa">Fresa</label>
<input type="checkbox" id="naranja" name="frutas" value="naranja">
<label for="naranja">Naranja</label>
    

Y aquí una Lista despegable



<label for="frutas">Selecciona tus frutas favoritas:</label>
<select id="frutas" name="frutas">
  <optgroup label="Frutas rojas">
    <option value="fresa">Fresa</option>
    <option value="frambuesa">Frambuesa</option>
    <option value="cereza">Cereza</option>
  </optgroup>
  <optgroup label="Frutas amarillas">
    <option value="platano">Plátano</option>
    <option value="piña">Piña</option>
    <option value="mango">Mango</option>
  </optgroup>
  <optgroup label="Frutas naranjas">
    <option value="naranja">Naranja</option>
    <option value="mandarina">Mandarina</option>
    <option value="papaya">Papaya</option>
  </optgroup>
</select>

Este es un formulario

Contáctame

  <form>
    <label for="name">Nombre:</label>
    <input type="text" id="name" name="name" placeholder="Tu Nombre" required>
    <label for="email">Correo:</label>
    <input type="email" id="email" name="email" placeholder="Tu correo" required>
    <label for="message">Mensaje:</label>
    <textarea id="message" name="message" placeholder="Deja tu mensaje" required></textarea>
    <button type="submit" id="submit-btn">Enviar</button>
  </form>

Botón para regresar a la página principal

Regresar a la página principal
 
    <a href="index.html" class="back-button" onclick="history.back()">Regresar a la página principal</a>