Bienvenido a la Comunidad de Treehouse

¿Quieres colaborar en errores de código? ¿Tienes errores que necesitan comentarios? ¿Buscas un par de ojos adicionales en tu último proyecto? aquí.

¿Buscas aprender algo nuevo?

Treehouse ofrece una prueba gratuita de siete días para estudiantes nuevos. Obtén acceso a miles de horas de contenido y únete a miles de

Inicia tu prueba gratuita

CSS Conceptos básicos de Bootstrap Creando formularios con Bootstrap Agregue CSS personalizado a su sitio de Bootstrap

custom.css no está siendo reconocido por el navegador en absoluto

Parece que mis estilos en el archivo custom.css no están siendo reconocidos por el navegador en absoluto. Al inspeccionar cualquier elemento cuyos estilos se supone que deben ser anulados por el css personalizado, no hay rastro de los estilos de ese archivo. El archivo custom.css está debajo del archivo bootstrap en la sección head. Estoy bastante perdido. No estoy seguro de cuál es el problema o qué podría ser.

  <head>
    <title>Conferencia Full Stack</title>
    <!-- Etiquetas meta requeridas -->
    <meta charset=utf-8>
    <meta name=viewport contenido=width=device-width, initial-scale=1, shrink-to-fit=no>

    <!-- Bootstrap CSS -->
    <link rel=stylesheet href=https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css integrity=sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M crossorigin=anonymous>
    <link ref=stylesheet href=css/custom.css>
  </head>

Reglas de custom.css

.navbar .navbar-brand {
  color: rgba(255, 255, 255, 0.85);
  font-size: 1rem;
}

.jumbotron {
  background-image: url('../img/jumbo-bg.jpg');
  background-size: cover;
}

elemento html <a> siendo dirigido por la primera regla

    <nav class=navbar navbar-expand-lg navbar-dark bg-primary fixed-top>
      <div class=container>
        <a class=navbar-brand order-1 mr-0 href=http://teamtreehouse.com target=_blank>Presentado por Team Treehouse</a>

Cuando inspecciono este elemento, solo se aplican reglas css de bootstrap. Sin rastro de ninguna regla de custom.css

3 Respuestas

Steven Parker
Steven Parker
244 163 puntos

Es solo un error tipográfico donde el elemento link tiene un atributo "ref" en lugar de "rel":

    <link ref=stylesheet href=css/custom.css>  <!-- código actual -->
    <!--    ^     -->
    <link rel=stylesheet href=css/custom.css>  <!-- código correcto -->

Debo haber mirado esto 20 veces porque sabía que tenía que ser algo con el link pero mi cerebro simplemente no pudo notar esa "l" en lugar de "f". Gracias Steven Parker.

Hola michael apprich No estoy trabajando con bootstrap como regla, por lo tanto, no estoy completamente seguro sobre mi teoría - pero a medida que bootstrap ha evolucionado a lo largo de los años, podría haber sido más desafiante anular esas reglas y lo que funcionó cuando se creó el video, podría no funcionar más.

Hubo una pregunta similar hace aproximadamente dos años - tal vez ayude: https://teamtreehouse.com/community/custom-css-not-being-applied

Si bootstrap estuviera anulando mi css personalizado, debería aparecer en el inspector como anulado, ¿no? Ni siquiera está apareciendo en el inspector, lo que me lleva a creer que es algo más.

Steven Parker, ¿tienes alguna idea?