Модальное окно на HTML и CSS
11:39 6.09.2017
Тут знакомый задавался вопросом о том, как сделать очень простое модальное окно на HTML и CSS и получилось, как он хотел!
Вот наверно самое модальное окно:
Ссылка для открытия окошка:
Сам блок окна:
И класс окна:
Вот и все.
По желанию можно приукрасить свое окно, закруглить углы, затемнить страницу при появлении окна и выбрать место на странице, где должно появляться окошко и так далее.
Надеюсь информация была полезной.
Спасибо за внимание.
Вот наверно самое модальное окно:
Ссылка для открытия окошка:
<a href="#openwindow">Открыть окно</a>
Сам блок окна:
<div id="openwindow" class="window">
<div>
Тут контент
<br />
<a href="#">Закрыть</a>
</div>
</div>
И класс окна:
.window {
display: none;
}
.window:target {
display: block;
}
.window > div {
width: 250px;
margin: 10% auto;
padding: 15px;
background: #DFDFDF;
}
Вот и все.
По желанию можно приукрасить свое окно, закруглить углы, затемнить страницу при появлении окна и выбрать место на странице, где должно появляться окошко и так далее.
Надеюсь информация была полезной.
Спасибо за внимание.
- Жалоба