Этот вопрос закрыт для ответов, так как повторяет вопрос Django не загружает CSS?
@Nicknameme

Как настроить css в django?

Всем привет!. У меня проблема с подключением css. Скачал шаблон с интернета и подключил к джанго.

Код в base.html:
<!doctype html>
<html lang="en">

{% load static %}

<head>
	<!-- Required meta tags -->
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
	<link rel="icon" href="{% static 'img/favicon.png' %}" type="image/png">
	<title>About Us</title>
	<!-- Bootstrap CSS -->
	<link rel="stylesheet" href="{% static 'css/bootstrap.css' %}">
	<link rel="stylesheet" href="{% static 'vendors/linericon/style.css' %}">
	<link rel="stylesheet" href="{% static 'css/font-awesome.min.css' %}">
	<link rel="stylesheet" href="{% static 'vendors/owl-carousel/owl.carousel.min.css' %}">
	<link rel="stylesheet" href="{% static 'css/magnific-popup.css' %}">
	<link rel="stylesheet" href="{% static 'vendors/nice-select/css/nice-select.css' %}">
	<!-- main css -->
	<link rel="stylesheet" href="{% static 'css/style.css' %}">
</head>

<body>

	<!--================ Start Header Area =================-->
	<header class="header_area">
		<div class="main_menu">
			<nav class="navbar navbar-expand-lg navbar-light">
				<div class="container">
					<!-- Brand and toggle get grouped for better mobile display -->
					<a class="navbar-brand logo_h" href="index.html"><img src="{% static 'img/logo.png' %}" alt=""></a>
					<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
					 aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
					</button>
					<!-- Collect the nav links, forms, and other content for toggling -->
					<div class="collapse navbar-collapse offset" id="navbarSupportedContent">
						<ul class="nav navbar-nav menu_nav justify-content-end">
							<li class="nav-item"><a class="nav-link" href="index.html">Home</a></li>
							<li class="nav-item active"><a class="nav-link" href="about.html">About</a></li>
							<li class="nav-item"><a class="nav-link" href="services.html">Services</a></li>
							<li class="nav-item"><a class="nav-link" href="portfolio.html">Portfolio</a></li>
							<li class="nav-item submenu dropdown">
								<a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
								 aria-expanded="false">Pages</a>
								<ul class="dropdown-menu">
                                    <li class="nav-item"><a class="nav-link" href="elements.html">Elements</a></li>
                                    <li class="nav-item"><a class="nav-link" href="portfolio-details.html">Portfolio Details</a></li>
								</ul>
							</li>
							<li class="nav-item submenu dropdown">
								<a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
								 aria-expanded="false">Blog</a>
								<ul class="dropdown-menu">
									<li class="nav-item"><a class="nav-link" href="blog.html">Blog</a></li>
									<li class="nav-item"><a class="nav-link" href="single-blog.html">Blog Details</a></li>
								</ul>
							</li>
							<li class="nav-item"><a class="nav-link" href="contact.html">Contact</a></li>
						</ul>
					</div>
				</div>
			</nav>
		</div>
	</header>

</body>
</html>

У меня полностью подключился bootstrap, но проблема с главным css файлом css/style.css
Код в css/style.css:
@import url("https://fonts.googleapis.com/css?family=Roboto:400,500|Rubik:500,700");
/*---------------------------------------------------- */
/*----------------------------------------------------*/
/* Medium Layout: 1280px */
/* Tablet Layout: 768px */
/* Mobile Layout: 320px */
/* Wide Mobile Layout: 480px */
/*---------------------------------------------------- */
/*----------------------------------------------------*/


/*---------------------------------------------------- */
/*----------------------------------------------------*/
.header_area {
  position: absolute;
  width: 100%;
  z-index: 9999;
  background: #ffffff; }
  .header_area .menu_nav {
    width: 100%; }
  .header_area .navbar {
    background: transparent;
    padding: 0px;
    border: 0px;
    border-radius: 0px;
    width: 100%; }
    .header_area .navbar .nav .nav-item {
      margin-right: 45px; }
      .header_area .navbar .nav .nav-item .nav-link {
        font: 500 14px/100px "Rubik", sans-serif;
        text-transform: uppercase;
        color: #000000;
        padding: 0px;
        display: inline-block; }
        .header_area .navbar .nav .nav-item .nav-link:after {
          display: none; }
      .header_area .navbar .nav .nav-item:hover .nav-link, .header_area .navbar .nav .nav-item.active .nav-link {
        color: #4458dc; }
      .header_area .navbar .nav .nav-item.submenu {
        position: relative; }
        .header_area .navbar .nav .nav-item.submenu ul {
          border: none;
          padding: 0px;
          border-radius: 0px;
          box-shadow: none;
          margin: 0px;
          background: #fff; }
          @media (min-width: 992px) {
            .header_area .navbar .nav .nav-item.submenu ul {
              position: absolute;
              top: 120%;
              left: 0px;
              min-width: 200px;
              text-align: left;
              opacity: 0;
              transition: all 300ms ease-in;
              visibility: hidden;
              display: block;
              border: none;
              padding: 0px;
              border-radius: 0px;
              box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.1); } }
          .header_area .navbar .nav .nav-item.submenu ul:before {
            content: "";
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 10px 10px 0 10px;
            border-color: #eeeeee transparent transparent transparent;
            position: absolute;
            right: 24px;
            top: 45px;
            z-index: 3;
            opacity: 0;
            transition: all 400ms linear; }
          .header_area .navbar .nav .nav-item.submenu ul .nav-item {
            display: block;
            float: none;
            margin-right: 0px;
            border-bottom: 1px solid #ededed;
            margin-left: 0px;
            transition: all 0.4s linear; }
            .header_area .navbar .nav .nav-item.submenu ul .nav-item .nav-link {
              line-height: 45px;
              color: #000000;
              padding: 0px 30px;
              transition: all 150ms linear;
              display: block;
              text-transform: capitalize;
              margin-right: 0px; }
            .header_area .navbar .nav .nav-item.submenu ul .nav-item:last-child {
              border-bottom: none; }
            .header_area .navbar .nav .nav-item.submenu ul .nav-item:hover .nav-link {
              color: #fff; }
        @media (min-width: 992px) {
          .header_area .navbar .nav .nav-item.submenu:hover ul {
            visibility: visible;
            opacity: 1;
            top: 100%; } }
        .header_area .navbar .nav .nav-item.submenu:hover ul .nav-item {
          margin-top: 0px; }
      .header_area .navbar .nav .nav-item:last-child {
        margin-right: 0px; }
  .header_area.navbar_fixed .main_menu {
    position: fixed;
    width: 100%;
    top: -70px;
    left: 0;
    right: 0;
    background: #ffffff;
    transform: translateY(70px);
    transition: transform 500ms ease, background 500ms ease;
    -webkit-transition: transform 500ms ease, background 500ms ease;
    box-shadow: 0px 3px 16px 0px rgba(0, 0, 0, 0.1); }
    .header_area.navbar_fixed .main_menu .navbar .nav .nav-item .nav-link {
      line-height: 70px; }
  @media (min-width: 992px) {
    .header_area.white_menu .navbar .navbar-brand img {
      display: none; }
      .header_area.white_menu .navbar .navbar-brand img + img {
        display: inline-block; } }
  @media (max-width: 991px) {
    .header_area.white_menu .navbar .navbar-brand img {
      display: inline-block; }
      .header_area.white_menu .navbar .navbar-brand img + img {
        display: none; } }
  .header_area.white_menu .navbar .nav .nav-item .nav-link {
    color: #fff; }
  .header_area.white_menu.navbar_fixed .main_menu .navbar .navbar-brand img {
    display: inline-block; }
    .header_area.white_menu.navbar_fixed .main_menu .navbar .navbar-brand img + img {
      display: none; }
  .header_area.white_menu.navbar_fixed .main_menu .navbar .nav .nav-item .nav-link {
    line-height: 70px;
    color: #000000; }

Если просто открыть base.html в браузере все нормально работает, но в django не правильно срабатывают стили.
При открытии в браузере:6043416a6da82077615747.png
При открытии с django: 604341b2ba01e103617734.png
Не могу понять в чем проблема
  • Вопрос задан
  • 66 просмотров
Пригласить эксперта
Ответы на вопрос 1
gedev
@gedev
сисадмин-энтузиаст
На вопрос уже много раз отвечали:
Django не загружает CSS?
Ответ написан
Ваш ответ на вопрос

Вопрос закрыт для ответов и комментариев

Потому что уже есть похожий вопрос.
Похожие вопросы
20 апр. 2021, в 16:05
20000 руб./за проект
20 апр. 2021, в 15:47
100000 руб./за проект
20 апр. 2021, в 15:36
400 руб./за проект