Recommended Posts

Как слово эквилибриум сдвинуть немного вниз ?

<!DOCTYPE html>

<html lang="en">
<head>
    <meta charset="UTF-8">
<title> Эквилибриум </title>
    <link rel="stylesheet" href="/ecomapp/assets/css/style.css">
    <meta name="description" content=""/>
    <meta name="keywords" content=""/>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css">
</head>
<body>
  <!-- Navigation -->
  <nav class="navbar navbar-expand-sm navbar-dark bg-dark fixed-top">
        </div>
      <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-8">
          <ul class="nav navbar-nav">
           {% if not request.get_full_path == '/' %}
              <li class="dropdown">
                  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
                     aria-expanded="false">Категории <span class="caret"></span></a>
                  <ul class="dropdown-menu">
                      {% for category in categories %}
                  <li><a href="{{ category.get_absolute_url }}">{{ category.name }}</a></li>
                      {% endfor %}
                  </ul>
              </li>
          {% endif %}
          </ul>
      </div>
  </nav>
  <!-- Page Content -->
  <div class="container">
{% block content %}
    <div class="row">
      <div class="col-lg-3">
        <p class="lead">Эквилибриум</p>
        <div class="list-group">
            {% for category in categories %}
          <a href="{{ category.get_absolute_url }}" class="list-group-item">{{ category.name }}</a>
            {% endfor %}
        </div>
      </div>
      <!-- /.col-lg-3 -->
        <div class="row">
          {% for product in products %}
          <div class="col-lg-4 col-md-6 mb-4">
            <div class="thumbnail">
              <img src="{{ product.image.url }}" alt="" style="width:100px; height: 150px;">
              <div class="caption">
                <h4 class="pull.right">{{ product.price }} руб.</h4>
                  <h5><strong><a href="{{ product.get_absolute_url }}">{{ product.title }}</a></strong></h5>
                  <p>{{ product.description }}</p>
              </div>
            </div>
          </div>
            {% endfor %}
        </div>
        <!-- /.row -->
      </div>
      <!-- /.col-lg-9 -->
    </div>
    <!-- /.row -->
  </div>
  <!-- /.container -->
  <div class="container">
{% endblock content %}
</div>
</body>
</html>
<footer class="py-0 bg-dark">
    <div class="container">
      <p class="m-145454 text-green">Copyright © Your Website 2019</p>
    </div>
    <!-- /.container -->
  </footer>

Share this post


Link to post
Share on other sites

В стилях

.lead {
	margin-top: %px;
}

где вместо % - необходимое количество пикселей.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By ashelpakov95
      Помогите, делаю чат-бота по этому уроку и коду https://fokit.ru/kak-sozdat-chat-bota-besplatno/
       
      Есть 6 веток вопросов. Я всё удобно подписал <!--Вопрос 1-->,<!--Вопрос 2-->....
      У меня бот прогоняет все вопросы какие есть.  Как сделать, чтобы после каждой ветки вопросов бот прекращал задавать вопросы? и еще, как сделать, чтобы бот выдавал вариант ответа, при нажатии на который, перекидывало на определенную страницу сайта?
      index-22.html
    • By marizza40
      Добрый день! Жаль что у вас тут темы не удаляются, потому что когда писала, нашла у себя ошибку, а сейчас тему удалить не могу. Но сейчас не об этом. 
      Есть не анимированный слайдер
      <div class="slider"> <div class="slider_site"> <img src="/images/slider_1.jpg" alt="DSC0604-min.jpg" border="0" class="img_slider"/> </div> <div class="slider_line"> </div> <div class="txt_left"> <h1 class="slider_h">АВТОМАТИЗАЦИЯ<br> КНС</h1> <div class="button"> <a href="#" class="button_a">Подробнее</a> </div><!--/.button--> </div> <div class="slider_site"> <img src="/images/slider_2.jpg" alt="DSC0604-min.jpg" border="0" class="img_slider"/> </div> <div class="slider_line_two"> </div> <div class="txt_left"> <h1 class="slider_h_two">НАСОСНЫЕ СТАНЦИИ</h1> <div class="button"> <a href="#" class="button_a_one">Подробнее</a> </div><!--/.button--> </div> </div> Весь текст идет поверх картинки. На компьютере смотрится хорошо, но при уменьшении экрана браузера все начинает плыть. Как грамотно настроить, чтобы текст и кнопка при уменьшении экрана не выглядели коряво? 
      CSS:
      /*slider*/ .slider{ display: flex; font-family: 'Roboto', sans-serif; } .slider_h{ position: absolute; color: #fff; top: 32%; left: 7%; font-size: 86px; line-height: 85px; text-align: right; } .slider_h_two{ position: absolute; color: #fff; top: 32%; left: 52%; font-size: 86px; line-height: 85px; } .slider_site{ width: 100%; } .img_slider{ width: 100%; position: relative; } .slider_line{ width: 170px; height: 3px; background: #0192dc; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); position: absolute; top: 32%; left: 42%; } .slider_line_two{ width: 170px; height: 3px; background: #0192dc; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); position: absolute; top: 32%; left: 57%; } /*button*/ .button_a{ vertical-align: top; padding: 8px 30px; border: 2px solid #0092db; font-size: 14px; font-weight: 700; color: #fff; text-transform: uppercase; text-decoration: none; margin: 20px auto; transition: 0.1s linear; position: absolute; top: 59%; left: 39%; } .button_a:hover{ color: #0092db; text-decoration: none; } .button_a_one{ vertical-align: top; padding: 8px 30px; border: 2px solid #0092db; font-size: 14px; font-weight: 700; color: #fff; text-transform: uppercase; text-decoration: none; margin: 20px auto; transition: 0.1s linear; position: absolute; top: 59%; left: 52%; } .button_a_one:hover{ color: #0092db; text-decoration: none; }  
    • By marizza40
      Первый раз создаю сайт на хостинге. Не видит блок о компании. Он в конструкции есть, на сайте пустота.  

  • Member Statistics

    46,552
    Total Members
    3,128
    Most Online
    igorofa
    Newest Member
    igorofa
    Joined
  • Recently Browsing   0 members

    No registered users viewing this page.