加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 资源网站 > 资源 > 正文

[Bootstrap]modal弹出框

发布时间:2020-12-14 19:48:00 所属栏目:资源 来源:网络整理
导读:div id="cnblogs_post_body" 写在前面 一个例子 模式弹出框 span style="color: #0000ff;"gt;//spanspan style="color: #800000;"gt;script/spanspan style="color: #0000ff;"gt;/spanspan style="color: #0000ff;"gt;/spanspan style="color: #800000;"gt;s

<div id="cnblogs_post_body">

写在前面

一个例子

模式弹出框
<span style="color: #0000ff;"&gt;</</span><span style="color: #800000;"&gt;script</span><span style="color: #0000ff;"&gt;></span>
<span style="color: #0000ff;"&gt;<</span><span style="color: #800000;"&gt;style</span><span style="color: #0000ff;"&gt;></span><span style="background-color: #f5f5f5; color: #800000;"&gt;
    .blue </span><span style="background-color: #f5f5f5; color: #000000;"&gt;{</span><span style="background-color: #f5f5f5; color: #ff0000;"&gt;
        background-color</span><span style="background-color: #f5f5f5; color: #000000;"&gt;:</span><span style="background-color: #f5f5f5; color: #0000ff;"&gt; #0094ff</span><span style="background-color: #f5f5f5; color: #000000;"&gt;;</span>
    <span style="background-color: #f5f5f5; color: #000000;"&gt;}</span><span style="background-color: #f5f5f5; color: #800000;"&gt;

    .text-center </span><span style="background-color: #f5f5f5; color: #000000;"&gt;{</span><span style="background-color: #f5f5f5; color: #ff0000;"&gt;
        text-align</span><span style="background-color: #f5f5f5; color: #000000;"&gt;:</span><span style="background-color: #f5f5f5; color: #0000ff;"&gt; center</span><span style="background-color: #f5f5f5; color: #000000;"&gt;;</span>
    <span style="background-color: #f5f5f5; color: #000000;"&gt;}</span>
<span style="color: #0000ff;"&gt;</</span><span style="color: #800000;"&gt;style</span><span style="color: #0000ff;"&gt;></span>

<span style="color: #0000ff;"></<span style="color: #800000;">head<span style="color: #0000ff;">>
<span style="color: #0000ff;"><<span style="color: #800000;">body<span style="color: #0000ff;">>
<span style="color: #0000ff;"><<span style="color: #800000;">input <span style="color: #ff0000;">type<span style="color: #0000ff;">="button"<span style="color: #ff0000;"> data-target<span style="color: #0000ff;">="#loginModal"<span style="color: #ff0000;"> data-toggle<span style="color: #0000ff;">="modal"<span style="color: #ff0000;"> name<span style="color: #0000ff;">="name"<span style="color: #ff0000;"> class<span style="color: #0000ff;">="form-control bt-red"<span style="color: #ff0000;"> value<span style="color: #0000ff;">="登录" <span style="color: #0000ff;">/>
<span style="color: #008000;">
<span style="color: #0000ff;"><<span style="color: #800000;">div <span style="color: #ff0000;">class<span style="color: #0000ff;">="modal fade"<span style="color: #ff0000;"> id<span style="color: #0000ff;">="loginModal"<span style="color: #ff0000;"> tabindex<span style="color: #0000ff;">="-1"<span style="color: #ff0000;"> role<span style="color: #0000ff;">="dialog"<span style="color: #ff0000;"> aria-labelledby<span style="color: #0000ff;">="myModalLabel"<span style="color: #ff0000;"> aria-hidden<span style="color: #0000ff;">="true"<span style="color: #0000ff;">>
<span style="color: #0000ff;"><<span style="color: #800000;">div <span style="color: #ff0000;">class<span style="color: #0000ff;">="modal-dialog"<span style="color: #0000ff;">>
<span style="color: #0000ff;"><<span style="color: #800000;">div <span style="color: #ff0000;">class<span style="color: #0000ff;">="modal-content"<span style="color: #0000ff;">>
<span style="color: #0000ff;"><<span style="color: #800000;">div <span style="color: #ff0000;">class<span style="color: #0000ff;">="modal-header blue"<span style="color: #0000ff;">><span style="color: #000000;">
登录
<span style="color: #0000ff;"></<span style="color: #800000;">div<span style="color: #0000ff;">>
<span style="color: #0000ff;"><<span style="color: #800000;">div <span style="color: #ff0000;">class<span style="color: #0000ff;">="modal-body"<span style="color: #0000ff;">>
<span style="color: #0000ff;"><<span style="color: #800000;">input <span style="color: #ff0000;">type<span style="color: #0000ff;">="text"<span style="color: #ff0000;"> class<span style="color: #0000ff;">="form-control"<span style="color: #ff0000;"> placeholder<span style="color: #0000ff;">="请输入用户名"<span style="color: #ff0000;"> name<span style="color: #0000ff;">="name" <span style="color: #0000ff;">/>
<span style="color: #0000ff;"><<span style="color: #800000;">input <span style="color: #ff0000;">type<span style="color: #0000ff;">="password"<span style="color: #ff0000;"> class<span style="color: #0000ff;">="form-control"<span style="color: #ff0000;"> placeholder<span style="color: #0000ff;">="请输入密码"<span style="color: #ff0000;"> value<span style="color: #0000ff;">="新建文件夹"<span style="color: #ff0000;"> name<span style="color: #0000ff;">="name" <span style="color: #0000ff;">/>
<span style="color: #0000ff;"></<span style="color: #800000;">div<span style="color: #0000ff;">>
<span style="color: #0000ff;"><<span style="color: #800000;">div <span style="color: #ff0000;">class<span style="color: #0000ff;">="modal-footer"<span style="color: #0000ff;">>
<span style="color: #0000ff;"><<span style="color: #800000;">div <span style="color: #ff0000;">class<span style="color: #0000ff;">="form-control text-center"<span style="color: #0000ff;">>登录<span style="color: #0000ff;"></<span style="color: #800000;">div<span style="color: #0000ff;">>
<span style="color: #0000ff;"><<span style="color: #800000;">div <span style="color: #ff0000;">class<span style="color: #0000ff;">="form-control text-center"<span style="color: #ff0000;"> data-dismiss<span style="color: #0000ff;">="modal"<span style="color: #0000ff;">><<span style="color: #800000;">div <span style="color: #ff0000;">class<span style="color: #0000ff;">="button"<span style="color: #0000ff;">></<span style="color: #800000;">div<span style="color: #0000ff;">>取消<span style="color: #0000ff;"></<span style="color: #800000;">div<span style="color: #0000ff;">>
<span style="color: #0000ff;"></<span style="color: #800000;">div<span style="color: #0000ff;">>
<span style="color: #0000ff;"></<span style="color: #800000;">div<span style="color: #0000ff;">>
<span style="color: #0000ff;"></<span style="color: #800000;">div<span style="color: #0000ff;">>
<span style="color: #0000ff;"></<span style="color: #800000;">div<span style="color: #0000ff;">>
<span style="color: #0000ff;"></<span style="color: #800000;">body<span style="color: #0000ff;">>
<span style="color: #0000ff;"></<span style="color: #800000;">html<span style="color: #0000ff;">>

注意

用js也可以来控制

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读