Question

按我的意图放置轮播字幕后，我的“轮播控制下一步”消失了。如果我将图标代码复制粘贴到另一个页面，则可以正常工作。另一件事是我无法将文本放在中间行。我才刚刚开始研究它，并且比我的腿大了一步哈哈哈

<html lang="pt-br">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="bootstrap.css">
    
    <style>


      .carousel-caption{
        right: 0 !important;
        left: 500px;
        height: 510px;
        width: 100 !important;
        bottom: 0;
      }
      
    </style>

    <title>Início</title>
  </head>
  <body>

    <nav class="navbar navbar-expand-lg navbar-light bg-primary">

      <div class="container">

        <a class="navbar-brand h1 mb-0" href="index.html">Caravana</a>

        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSite">
          <span class="navbar-toggler-icon"></span>
        </button>

        <div class="collapse navbar-collapse" id="navbarSite">

          <ul class="navbar-nav mr-auto">


            <li class="nav-item">
              <a class="nav-link" href="index.html"><mark>Início</mark></a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="Perfil.html">Perfil</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="Serviços.html">Serviços</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="Depoimentos.html">Depoimentos</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="Contatos.html">Contatos</a>
            </li>


          </ul>

          <ul class="navbar-nav ml-auto">
            <li class="nav-item dropdown">
              <a class="nav-link dropdown-toggle" href="#" data-toggle="dropdown" id="navDrop">Social
              </a>
              <div class="dropdown-menu">
                <a class="dropdown-item" href="#">Facebook</a>
                <a class="dropdown-item" href="#">Twitter</a>
                <a class="dropdown-item" href="#">Instagram</a>
              </div>
            </li>

          </ul>

          <form class="form-inline">
            <input class="form-control ml-4 mr-2" type="search" placeholder="Buscar...">
            <button class="btn btn-default" type="submit">Ok</button>
          </form>

        </div>

      </div>

    </nav>

    <div id="carouselSite" class="carousel slide" data-ride="carousel">

      <ol class="carousel-indicators">

        <li data-target="#carouselSite" data-slide-to="0" class="active"></li>
        <li data-target="#carouselSite" data-slide-to="1"></li>
        <li data-target="#carouselSite" data-slide-to="2"></li>

      </ol>

      <div class="carousel-inner" style="display: inline-flex">

        <div>
          <a class="carousel-control-prev" href="#carouselSite" role="button" data-slide="prev">
            <span class="carousel-control-prev-icon"></span>
            <span class="sr-only">Anterior</span>
          </a>

          <a class="carousel-control-next" href="#carouselSite" role="button" data-slide="next">
            <span class="carousel-control-next-icon"></span>
            <span class="sr-only">Avançar</span>
          </a>
        </div>


        <div class="carousel-item active">

          <div>
            <img src="cela.png" class="img-fluid d-block">          
          </div>
          

          <div class="carousel-caption">
            <div>
              <h3>
                Há oportunidades em toda adversidade. A quarentena está sendo um período terrível; nossas potências exploratórias são impedidas contra nossa vontade (muitas vezes sair de casa nem era algo comum, mas a característica de ser involuntário instiga a fazer essas coisas), vidas estão sendo ceifadas e temos que lidar com nossa própria consciência.
                Neste caminho de sofrimento, há adubo para a virtude.
              </h3>
            </div>
          </div>

        </div>

        <div class="carousel-item">
          <img src="Sobre celulares.png" class="img-fluid d-block">
          <div class="carousel-caption">
            <div>
              <h3>  
                Ao observar as pessoas fitando suas telinhas portáteis, me veio a imagem de alguém usando um óculos de realidade virtual, babando e vivendo um mundo que não aquele no qual se está presente. Qualquer desprazer é seguido de alguma tentativa de se esquivar dele. Desde tempos, estamos sendo docilizados. Apesar de toda a potência, as novas ferramentas tecnológicas que são lançadas dia após dia são vítimas das vidas despropositadas dos seres humanos contemporâneos. O que podemos fazer?
              </h3>
            </div>
          </div>
        </div>

        <div class="carousel-item">
          <img src="homo artificialis.png" class="img-fluid d-block">
          <div class="carousel-caption">
            <div>
              <h3>
                Aceitar que o sofrimento existe faz parte do caminho da verdade e, consequentemente, do caminho das virtudes. Utilizar as diversas ferramentas das mídias sociais para promover uma ficção sobre si desvirtua a todos de tal caminho, pois os parâmetros para a ação são maquiados e “ao agir baseado em mentiras, as consequências são os erros”. 
              </h3>
            </div>
          </div>
        </div>

      </div>

    </div>
    <h1>Hello, world!</h1>

    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="../../../Boobistrap/node_modules/jquery/dist/jquery.js"></script>
    <script src="../../../Boobistrap/node_modules/@popperjs/core/dist/umd/popper.js"></script>
    <script src="../../../Boobistrap/node_modules/bootstrap/dist/js/bootstrap.js"></script>
  </body>
</html>```


I copy-pasted everything because heavens know what is wrong. Thank you for any suggestion!

我按原意放置轮播字幕后，我的“轮播控制下一个”消失了

0 个答案: