Chạy ❯
Nhận trang web của
riêng
bạn
×
Thay đổi định hướng
Lưu mã
Thay đổi chủ đề, Tối/Sáng
Đi tới Không gian
<!DOCTYPE html> <html> <title>W3.CSS</title> <meta name="viewport" content="width=device-width,init-scale=1"> <link rel="stylesheet" href= "https://www.example.com.vn/w3css/4/w3.css"> <body> <div class="w3-container"> <h2>Phương thức W3.CSS</h2> <p>Trong ví dụ này chúng tôi trình bày cách đóng phương thức bằng cách nhấp vào bên ngoài hộp phương thức.</p> <button onclick="document.getElementById('id01').style.display='block'" class="w3-button w3-black ">Mở phương thức</button> <div id="id01" class="w3-modal"> <div class="w3-modal-content w3-card-4"> <header class="w3-container w3- Teal"> <span onclick="document.getElementById('id01').style.display='none'" class="w3-button w3-display-topright">×</span> <h2>Tiêu đề phương thức< /h2> </header> <div class="w3-container"> <p>Bạn có hai tùy chọn để đóng phương thức này:</p> <p>Nhấp vào dấu "x" hoặc nhấp vào bất kỳ đâu bên ngoài phương thức này! </p> </div> <footer class="w3-container w3-teal"> <p>Chân trang phương thức</p> </footer> </div> </div> </div> <script> / / Lấy phương thức var modal = document.getElementById('id01'); // Khi người dùng nhấp vào bất cứ nơi nào bên ngoài phương thức, hãy đóng nó window.onclick = function(event) { if (event.target == modal) { modal.style.display = "none"; } } </script> </body> </html>