Вопросы Теги

Поиск в списке быстрее, чем в кортеже?

Используйте абсолютное позиционирование и z-index для создания липкого нижнего колонтитула с любым разрешением, используя следующие шаги:

  • Создайте нижний колонтитул с position: absolute; bottom: 0; и желаемой высотой
  • Установите дополнение нижнего колонтитула, чтобы добавить пробел между нижней частью содержимого и нижней частью окна
  • Создайте контейнер div, который обертывает содержимое тела с помощью position: relative; min-height: 100%;
  • Добавить нижнее дополнение к основному контенту div, равное высоте и дополнению нижнего колонтитула
  • Установите нижний колонтитул z-index больше, чем контейнер div, если нижний колонтитул обрезается

Вот пример: 

    <!doctype html>
    <html>
    <head>
      <title>Sticky Footer</title>
      <meta charset="utf-8">
      <style>
      .wrapper { position: relative; min-height: 100%; }
      .footer { position: absolute; bottom:0; width: 100%; height: 200px; padding-top: 100px; background-color: gray; }
      .column { height: 2000px; padding-bottom: 300px; background-color: green; }
     /* Set the `html`, `body`, and container `div` to `height: 100%` for IE6 */

      </style>
    </head>
    <body>
      <div class="wrapper">
        <div class="column">
          <span>hello</span>
        </div>
        <div class="footer">
          <p>This is a test. This is only a test...</p>
        </div>
      </div>
    </body>
    </html>

21
задан Sean Vieira 18 January 2014 в 03:42
поделиться