Bạn có thể dùng nó để tạo popup thông báo, liên hệ, lưu ý,...
Xem demo
Chèn code
Quăng hết đống code này vào sau thẻ<body>
<style>#bsw_popup{top:0;left:0;right:0;bottom:0;position:fixed;opacity:0;visibility:hidden;transition:.5s;transform:scale(1.2)}
#bsw_popup:target{transform:scale(1);background:rgba(0,0,0,.2);opacity:1;visibility:visible;position:fixed;top:0;left:0;right:0;bottom:0;margin:0;z-index:999999999999;transition:.5s}
.bsw_popup_{background:#fff;border-radius:4px;z-index:999;width:600px;max-width:100%;position:fixed;top:45%;left:50%;transform:translate(-50%,-50%);margin:0;padding:20px;box-sizing:border-box;box-shadow:0 0 100px rgba(0,0,0,.1)}
.bsw_popup_ h2{margin:0 0 .75em;padding:0;text-align:center;font-weight:700;font-family:Roboto,sans-serif;color:#4267b2}
.bsw_popup_ h3{margin:0 0 5px;padding:0;font:500 15px Roboto;text-transform:uppercase}
.bsw_popup_ p{margin:0 0 20px;padding:0;font:400 15px Roboto;color:#555;line-height:1.5}
.bsw_popup_ p a{font-weight:700;color:#555}
.bsw_popup_ p a:hover{text-decoration:underline}
<!-- code popup bacsiwindows.com -->
</style>
<div id='bsw_popup'>
<div class='bsw_popup_'>
<h2>Hướng dẫn bình luận</h2>
<h3>Chèn link</h3>
<p>Sử dụng thẻ <code>&lt;a href=&#39;LINK&#39;&gt;TÊN_HIỂN_THỊ&lt;/a&gt;</code></p>
<h3>Chèn hình ảnh</h3>
<p><code>[img] LINK_ANH [/img]</code> - sử dụng công cụ bên dưới để upload ảnh.</p>
<h3>Định dạng chữ</h3>
<p> &lt;b&gt; <b>Chữ in đậm</b> &lt;/b&gt;<br/> &lt;i&gt; <i>Chữ in nghiêng</i> &lt;/i&gt;<br/> &lt;u&gt; <u>Chữ gạch chân</u> &lt;/u&gt;<br/> &lt;strike&gt; <strike>Chữ gạch ngang</strike> &lt;/strike&gt;<br/> </p>
<h3>Chèn một đoạn Code</h3>
<p>Đầu tiên sử dụng <a href='//bacsiwindows.com/mahoahtml' target='blank'>công cụ này</a> để mã hóa đoạn code muốn chèn.<br/>Sau đó dùng thẻ <code>[code] CODE_ĐÃ_MÃ_HÓA [/code]</code></p><a class='close' href='#close' title='Close'><i aria-hidden='true' class='fa fa-check'/> Đã hiểu</a> </div>
</div>
Cách sử dụng
Thêmhref="#bsw_popup"
hoặc id="#bsw_popup"
vào bất cứ thẻ nào mà bạn muốn khi click sẽ hiện popup ra là được.Ví dụ:
<a href="#bsw_popup">Mở Popup</a>
Không có nhận xét nào