<div class="container">
  <h1>Адаптивная верстка</h1>
  <p>Это простой пример адаптивной веб-страницы.</p>
</div>
body {
  font-family: Arial, sans-serif;
  background-color: #f0f0f0;
  margin: 0;
  padding: 0;
}

.container {
  max-width: 960px;
  margin: 0 auto;
  padding: 20px;
  background-color: #ffffff;
}

/* Стили для мобильных устройств */
@media (max-width: 600px) {
  .container {
    padding: 10px;
  }
}

/* Стили для планшетов и больших экранов */
@media (min-width: 601px) {
  .container {
    padding: 20px;
  }
}
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.