@TellS

Вопрос как сделать адаптивность на сайт?

Вот код :
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>ФОРМА ЗАЯВКИ</title>
	<link rel="stylesheet" type="text/css" href="css/style.css">
	<link rel="stylesheet" type="text/css" href="css/media-quiries.css">
</head>
<body>

	<div class="content">
		<h1>Оставить заявку!</h1>
		<input type="email" name="email"><br>
		<a id="fig" href="#">Отправить</a>
	</div>

</body>
</html>


Как мне сделать что на телефонах текст и все оставльно отображалось правильно ? Крч как его сделать адаптивным
  • Вопрос задан
  • 115 просмотров
Решения вопроса 1
@Avenant
Начинающий Fronted-разработчик
Как сказал человек выше - брейкпоинты.
Ну и не забыть указать в meta-тегах.
<meta name="viewport" content="width=device-width" />


@media screen and (max-width: /*Это будет означать ширину экрана на котором применятся стили*/) {
    .content {
        /*Тут стили которые применятся при указаной ширине экрана*/
    }
}
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
veryoriginalnickname
@veryoriginalnickname
Ставить брекпойнт(ы), например на максимальную ширину экрана 640px, и далее внутри менять блоки как надо. Например:
@media screen and (max-width: 640px){
  .content{
    width: 220px;
  }
}

Ну или использовать всякие готовые либы, типа бутстрапа, где уже есть адаптивность.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы