Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 05.12.2021, 18:54   #1
Диана 20
Новичок
Джуниор
 
Регистрация: 05.12.2021
Сообщений: 1
По умолчанию Добрый вечер,помогите пожалуйста сделать этот сайт адаптивным??

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Єдиний центр послуг</title>


<style>
*{
padding: 0;
margin: 0;
}
body{
font-family: Arial, Helvetica, sans-serif;
}
.container {
background: #fff;
margin: 0;
width: 100%;
height: 100%;
display: inline-block;
border: 20px solid #ff0000;
}



/*Block1*/
.block1{
width: 100%;
height: 700px;
}
.image1{
padding-top: 15px;
display: block;
margin-left: auto;
margin-right: auto;
}

.image2{
padding-top: 35px;
padding-bottom: 20px;
display: block;
margin-left: auto;
margin-right: auto;
}
.p{
display: block;
text-align: center;
font-weight: bold;
font-size: 35px;
}

/*Block2*/

.block2{
height: 350px;
background: #ff0000;
}

.p1{
font-weight: bold;
color: #fff;
font-size: 42px;
padding-top: 20px;
padding-left: 35px;
padding-bottom: 30px;
}
.p2{
font-weight: bold;
font-size: 42px;
padding-top: 80px;
padding-left: 35px;
padding-bottom: 30px;
}
.p3{
font-size: 29px;
padding-top: 20px;
padding-left: 35px;
padding-bottom: 30px;
}
.ol1{
color: #fff;
font-size: 29px;
padding-left: 70px;
padding-bottom: 15px;
}
.ol2{
font-size: 29px;
padding-left: 70px;
padding-bottom: 15px;
}
/*Block3*/
.block3{
height: 480px;
}

.block4{
height: 380px;
background: #ff0000;
}
.block5{
height: 560px;
}
.pictur{
margin-top: 35px;
}
.block6{
height: 320px;
background: #ff0000;
}
.block7{
height: 700px;
}
.block8{
height: 480px;
background: #ff0000;
}
.parag{
color: #fff;
font-size: 29px;
padding-top: 20px;
padding-left: 35px;
padding-bottom: 30px;
}
.block9{
height: 280px;
}
.auto{
font-size: 29px;
padding-top: 30px;
padding-left: 35px;
padding-bottom: 30px;
}
.element{
text-align: center;
}
.clock i,p{
display: inline-block;
color: #000;
font-size: 45px;
padding-left: 15px;
margin: 0 auto;
}
</style>
</head>

<body>
<div class='container'>
<div class='block1'>
<img class='image1' src="image/logo.png" width="180" height="110" alt="lorem">
<img class='image2' src='image/222.png' width="500" height="430" alt="lorem">
<p class='p'>Добрый день!</p>
</div>

<div class='block2'>
<p class='p1'><strong> Надеемся Вам будут интересны <br>условия сотрудичества:</strong></p>
<ol class='ol1'>
<li>Оплата только за вызов после оказанной услуги.</li>
<li>Электронный вариант счета получите на свою почту, оригинал и акт<br>
выполненных работ - при встрече с менеджером.</li>
<li>Один раз в квартал подписывается акт сверки для понимания состояния расчета<br>
с ЕЦУ по аварийным работам.</li>
</ol>
</div>

<div class='block3'>
<p class='p2'><strong>Стоимость вызова</strong></p>
<ol class='ol2'>
<li><strong>8:00-17:00</strong> - 300* грн. (для Ингульца - 500 грн.).</li>
<li><strong>17:00 до 8:00</strong> (вечернее и ночное время) - 450* грн. (для Ингульца 650 грн.).<br></li>
</ol>
<p class='p3'>300 грн за вызов - лучшая цена в Кривом Роге на аварийное обслуживание. В<br>
следующем году она точно увеличится, воспользуйтесь нашим предложением<br>
сейчас и сохраните за собой эти условия на весь будущий год! Ими уже<br>
воспользовалось около 135 ОСМД в Кривом Роге.</p>
</div>

<div class='block4'>
<p class='p1'><strong> “Аварийная служба Единого Центра Услуг (ЕЦУ)” <br>предоставляет:</strong></p>
<ol class='ol1'>
<li>Круглосуточный вызов с учетом выходных и праздников через колл-центр<br> Аварийной Службы.</li>
<li>Прочистка канализации (общедомовая и в квартирах жильцов).</li>
<li>Прочистка выпусков.</li>
<li>Ликвидация течи в системе водоснабжения и отопления.</li>
<li>Устранение замыкания проводки и подача электроснабжения в дом.</li>
</ol>
</div>

<div class='block5'>
<img class='pictur' src="image/picture.png" width="1493" height="780px" alt="lorem">
</div>

<div class='block6'></div>

<div class='block7'>
<p class='p2'><strong> А что если аварийная ситуация случится именно в<br>
момент праздника?</strong></p>
<p class='p3'><strong>Порой мы идеализируем условия, в которых живем. Считаем, что :</strong></p>
<p class='p3'>«безоблачное будущее» будет долгим. Но непредвиденные ситуации всгда<br>
приходят неожиданно. К тому же<br> накануне Нового Года количество засоров канализации возрастает в разы и<br>
дополнительный страховочный вариант окажется кстати.</p>
<p class='p3'>Праздник может быть изрядно испорченным, когда в самый неподходящий момент<br>
вам начинают названивать жильцы ОСМД: “ Спасите, помогите! Нас топят!”Вы<br>
начинаете звонить знакомым сантехникам. Но… праздники, отпуска, уехал,<br>
заболел. Ситуации могут быть разные и стоит иметь вариант на все случаи жизни.</p>
</div>

<div class='block8'>
<p class='p1'><strong>Аварийна Служба ЕЦУ:</strong></p>
<ol class='ol1'>
<li>Это свой круглосуточный колл-центр</li>
<li>Обученные профессионалы</li>
<li>Новые автомобили и современное оборудование</li>
</ol>
<p class='parag'><strong>Наша бригада быстро, слаженно и профессионально выполнит работы!</strong></p>
<p class='parag'>Единый Ценр Услуг - это очень эффектно и эффективно! На вызов БЫСТРО<br>
приезжает новенький ФИАТ с сотрудниками одетыми в красивую спецформу. По их<br>
слаженным действиям становится понятно, что дело делают профессионалы и им<br>
можно доверять!</p>
</div>

<div class='block9'>
<p class='p2'><strong> Готовы заключить договор или есть еще вопросы?</strong></p>
<p class='auto'>Позвоните нам по телефону:</p>
<a class='clock' href="#"><i class="fas fa-phone-alt"></i></a>
<p class='clock'><strong>+380957333718 </strong></p>
</div>

</div>

<script src="https://kit.fontawesome.com/96510ad6b6.js" crossorigin="anonymous"></script>
</body>
</html>
Диана 20 вне форума Ответить с цитированием
Старый 26.07.2022, 10:47   #2
yellowres
Заблокирован
 
Регистрация: 25.07.2022
Сообщений: 27
По умолчанию

Ширина div'ов, она обычно делается через css-стиль:
width: 100%;
также есть css-стили:
min-width
max-width
yellowres вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
[C++] добрый вечер, можете помочь составить блок-схему к программе, пожалуйста lana_ar Помощь студентам 4 22.10.2019 16:44
вечер добрый помогите разобраться в инструкции enter с уровнем вложенности char[] Assembler - Ассемблер (FASM, MASM, WASM, NASM, GoASM, Gas, RosAsm, HLA) и не рекомендуем TASM 4 04.10.2019 23:28
Добрый вечер. Расскажите, пожалуйста, что делает спецсимвол \r? nevender Общие вопросы по Java, Java SE, Kotlin 6 22.01.2016 23:00
ДОбрый вечер, ночь. Помогите решить задачу на си плиззз Pavelhr Общие вопросы C/C++ 6 12.12.2009 02:10