0

Hola que tal estoy empezando con el framework Django y tengo problema para dar styles a traves de CSS. Especificamente todo HTML me carga automaticamente base.css. Para evitar esto se me ocurrio poner en base.html un {% block %} que contenga el mencionado link.

Al hacer eso efectivamente el resto de HTML que tengo no se les carga automaticamente el base.css, pero como efecto secundario todo lo que se encuentra en base.html queda sin ningun style.

En un intento de solucionar esto deje en base.html el link fuera del {% block %} y en los denas html les pongo la hoja que corresponde de css. Al hacer esto usando el modo inspector del explorador puede ver que ambos links (base.css y el otro que cargue) aparecen entre los elementos pero el unico que tiene efecto es base.css.

dejo un poco de codigo para que quede bien claro lo que intente: 1) Base.html

{% load static %}
<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <link rel="stylesheet" type="text/css" href="{% static 'css/base.css' %}">
    {% block linkcss %}{% endblock %}
    <meta charset="utf-8">
    <title>{% block titulo %}{% endblock %}</title>

2)brevehistoria.html

{% extends 'base.html' %}

{% load static %}

<!-- ERROR PARA VISUALIZAR EL CSS brevehistoria.css -->
{% block linkcss %}<link rel="stylesheet" href='/css/brevehistoria.css'>{% endblock %}
{% block titulo %}Cervezeria El Choborra {% endblock %}

Mi pregunta es: si es posible modificar el codigo de tal forma que cuando otro html haga un extends 'base.html', me cargue para base su correspondiente css, pero que para el html se visualize tambien su propia hoja css??

1 respuesta 1

1

Bueno por si alguien mas llegara a tener esta duda paso a explicar mi solucion.

Desde que tuve este problema mi enfoque fue siempre usar buscar la manera de que django me cargara 2 stylesheet de css, en mi ignorancia nunca me habia planteado que la solucion este mismo en el css.

Lo que hice fue dejar en base.html el codigo cortado por un {% Block %}asi no se me cargaba base.css en todos los demas templates. Y lo que hice fue agregar en sus respectivos css una sola propiedad en la primera linea de codigo que es: @import url("base.css");.

Con esto cada css 'hereda' todo lo que habia en base.css y a partir de ahi se puede seguir agregando lo que corresponda a cada template de forma legible.

Quizas fue muy de ignorante mi pregunta pero no conocia la propiedad @import y me tenia algo trancado eso. Comparto y espero sea util para alguna otra porbe alma ignorante como yo XD.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.