There is a button:
<a href="#" class="to_contact">Нажать</a> It is necessary that when you click it, an adaptive modal window appears in the middle of the screen with 3 input fields and 2 buttons to close and continue.
How to implement it without bootstrap?
Here you are:
.modalDialog { overflow: auto; position: fixed; font-family: Arial, Helvetica, sans-serif; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0, 0, 0, 0.8); z-index: 99999; display: none; } .modalDialog:target { display: block; pointer-events: auto; } .modalDialog>div { width: 400px; position: relative; margin: 20% auto; padding: 5px 20px 13px 20px; border-radius: 10px; background: #fff; } .close { background: #606061; color: #FFFFFF; line-height: 25px; position: absolute; right: -12px; text-align: center; top: -10px; width: 24px; text-decoration: none; font-weight: bold; } <a href="#openModal">Открыть модальное окно</a> <div id="openModal" class="modalDialog"> <div> <a href="#close" title="Закрыть" class="close">x</a> <h2>Модальное окно</h2> <input type="text"><br> <input type="text"><br> <input type="text"><br> <a href="#">Продолжить</a><br> </div> </div> 
Source: https://ru.stackoverflow.com/questions/847560/
All Articles