Question

我正在创建一个网站，并在我的一个页面上处理一个模式，其文本如下：

约翰：894824

我想创建一个按钮，只有当我触发它时才显示上面的文字。

我正在阅读其他与此相关的内容，但更像是按下按钮并使框滑动并显示。这就是我想在这里做的事情。如果有人理解我的问题并且能够帮助解决这个问题，我会非常感激。

由于

<div class="modal modal_quero_contratar modal-xs fade" id="modal" role="dialog">

<!-- Modal content-->
<div class="modal-content">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal">&times;</button>
    <h4 class="modal-title"> Você tem certeza que deseja contratar este serviço? </h4>
  </div>

    <div class="modal-body">        

        <p class = "modal_texto1"> Se você optar por contratar, será solicitada uma availiação sua sobre o serviço prestado. </p>
        <p> Abaixo seguem as informações de contato: </p>
        <p class="servico_email_contato">  </p>
        <p class="servico_cel_contato">  </p>
        <p class="servico_telefone_contato">  </p>
        <br>
        <p> Este quebra-galho foi também salvo no seu painel! </p>


    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>
    </div>


</div>

Answer 1

这需要bootstrap，这里是代码

＆＃13;

<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet" />
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#modal">
  Launch demo modal
</button>
<div class="modal modal_quero_contratar modal-xs fade" id="modal" role="dialog">

  <!-- Modal content-->
  <div class="modal-content">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal">&times;</button>
      <h4 class="modal-title"> Você tem certeza que deseja contratar este serviço? </h4>
    </div>

    <div class="modal-body">

      <p class="modal_texto1">Se você optar por contratar, será solicitada uma availiação sua sobre o serviço prestado.</p>
      <p>Abaixo seguem as informações de contato:</p>
      <p class="servico_email_contato"></p>
      <p class="servico_cel_contato"></p>
      <p class="servico_telefone_contato"></p>
      <br>
      <p>Este quebra-galho foi também salvo no seu painel!</p>


    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>
    </div>


  </div>

＆＃13;

创建一个使这个特定功能的按钮（html，css）

1 个答案: