Index.html

<!doctype html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Blog de Audición</title>
  <link rel="stylesheet" href="styles.css">
  <!-- Enlace a Bootstrap CSS -->
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
</head>
<body>

<!-- Barra de navegación -->
<nav class="navbar navbar-expand-md bg-body-tertiary">
  <div class="container-fluid">
    <a class="navbar-brand" href="index.html">Blog de Audición</a>
    <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>
    </button>
    <div class="collapse navbar-collapse" id="navbarNav">
      <ul class="navbar-nav ms-auto">
        <li class="nav-item">
          <a class="nav-link active" aria-current="page" href="index.html">Inicio</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="#cursos">Cursos</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="#casos-publicados">Casos Publicados</a>
        </li>
      </ul>
    </div>
  </div>
</nav>

<!-- Carrusel de imágenes -->
<div id="carouselExampleIndicators" class="carousel slide" data-bs-ride="carousel">
  <div class="carousel-indicators">
    <button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
    <button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="1" aria-label="Slide 2"></button>
    <button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="2" aria-label="Slide 3"></button>
  </div>
  <div class="carousel-inner">
    <div class="carousel-item active">
      <img src="/imagenes/inicio1.1.jpg" class="d-block w-100 carousel-img" alt="Imagen 1">
    </div>
    <div class="carousel-item">
      <img src="/imagenes/inicio2-GA.jpg" class="d-block w-100 carousel-img" alt="Imagen 2">
    </div>
    <div class="carousel-item">
      <img src="/imagenes/inicio4.1.jpg" class="d-block w-100 carousel-img" alt="Imagen 3">
    </div>
  </div>
  <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide="prev">
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
    <span class="visually-hidden">Anterior</span>
  </button>
  <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide="next">
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
    <span class="visually-hidden">Siguiente</span>
  </button>
</div>

<!-- Sección de Blog -->
<div class="container my-5">
  <h2>Entradas de Blog</h2>
  <div class="row">
    <!-- Entrada de Blog 1 -->
    <div class="col-md-4 mb-4">
      <div class="card">
        <img src="/imagenes/entrada1.webp" class="card-img-top" alt="Imagen de Entrada">
        <div class="card-body">
          <h5 class="card-title">Pérdida Auditiva en Niños</h5>
          <p class="card-text">Este artículo proporciona una visión general de las causas de pérdida auditiva en menores y ofrece estrategias para su prevención.</p>
          <a href="publicacion1.html" class="btn btn-primary">Leer más</a>
        </div>
      </div>
    </div>
    <!-- Entrada de Blog 2 -->
    <div class="col-md-4 mb-4">
      <div class="card">
        <img src="/imagenes/Entrada2.jpg" class="card-img-top" alt="Imagen de Entrada">
        <div class="card-body">
          <h5 class="card-title">Osteoporosis en el Oído Medio: Causas, Síntomas y Tratamientos</h5>
          <p class="card-text">La osteoporosis no solo afecta huesos como la cadera, sino también el oído medio. Descubre cómo impacta la audición.</p>
          <a href="osteoporosis.html" class="btn btn-primary">Leer más</a>
        </div>
      </div>
    </div>
    <!-- Entrada de Blog 3 -->
    <div class="col-md-4 mb-4">
      <div class="card">
        <img src="/imagenes/entrada3.jpg" class="card-img-top" alt="Imagen de Entrada">
        <div class="card-body">
          <h5 class="card-title">El Equilibrio en el Oído Interno: Clave para una Vida Estable</h5>
          <p class="card-text">Descubre cómo el sistema vestibular en el oído interno mantiene nuestro equilibrio y orientación espacial.</p>
          <a href="oidoInterno.html" class="btn btn-primary">Leer más</a>
        </div>
      </div>
    </div>
  </div>
</div>

<!-- Sección de Cursos -->
<div class="container my-5" id="cursos">
  <h2>Cursos</h2>
  <div class="row">
    <div class="col-md-4 mb-4">
      <div class="card">
        <div class="card-body">
          <h5 class="card-title">Curso de Diagnóstico Auditivo</h5>
          <p class="card-text">Aprende las técnicas avanzadas para diagnosticar problemas de audición en diferentes grupos de edad.</p>
        </div>
      </div>
    </div>
    <div class="col-md-4 mb-4">
      <div class="card">
        <div class="card-body">
          <h5 class="card-title">Rehabilitación Vestibular</h5>
          <p class="card-text">Especialízate en técnicas de rehabilitación para pacientes con trastornos del equilibrio.</p>
        </div>
      </div>
    </div>
    <div class="col-md-4 mb-4">
      <div class="card">
        
        <div class="card-body">
          <h5 class="card-title">Audífonos y Ayudas Auditivas</h5>
          <p class="card-text">Conoce los últimos avances en tecnologías de audífonos y cómo personalizar la experiencia para cada paciente.</p>
        </div>
      </div>
    </div>
  </div>
</div>

<!-- Sección de Casos Publicados -->
<div class="container my-5" id="casos-publicados">
  <h2>Casos Publicados</h2>
  <ul class="list-group">
    <li class="list-group-item">
      <h5>Caso 1: Diagnóstico de Pérdida Auditiva en Adultos Mayores</h5>
      <p>Este caso presenta un estudio sobre cómo identificar y diagnosticar pérdida auditiva en personas mayores.</p>
    </li>
    <li class="list-group-item">
      <h5>Caso 2: Tratamiento de la Enfermedad de Ménière en Pacientes Jóvenes</h5>
      <p>Un análisis detallado del tratamiento de la enfermedad de Ménière en pacientes jóvenes.</p>
    </li>
    <li class="list-group-item">
      <h5>Caso 3: Implantes Cocleares en Niños con Hipoacusia Bilateral</h5>
      <p>Este caso documenta la implantación coclear en niños pequeños con hipoacusia bilateral.</p>
    </li>
    <li class="list-group-item">
      <h5>Caso 4: Estudio Comparativo de Soluciones Auditivas para Atletas</h5>
      <p>Un estudio que examina varias soluciones auditivas para atletas.</p>
    </li>
    <li class="list-group-item">
      <h5>Caso 5: Rehabilitación Vestibular para Pacientes con Vértigo Crónico</h5>
      <p>Se describe la rehabilitación vestibular en pacientes que sufren vértigo crónico.</p>
    </li>
  </ul>
</div>

<!-- Pie de página -->
<footer class="bg-dark text-white text-center py-3">
  <p>© 2024 Blog de Audición y Equilibrio | Todos los derechos reservados</p>
</footer>

<!-- Enlace a Bootstrap JS -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-N2Ttt3EjoPpmmO8lKLEfPimRYipnVV4d7IoQByYPQ/3ZLqYrXHA5ZPBFu/oVZejD" crossorigin="anonymous"></script>
</body>
</html>