[Помогите] с header

Тема в разделе "Вёрстка (HTML, CSS)", создана пользователем etens1212, 29 дек 2015.

  1. etens1212

    etens1212

    Регистрация:
    1 май 2013
    Сообщения:
    320
    Симпатии:
    16
    как мне сделать header
    на всю высоту окна
    то есть картинка
    она занимает все окно
    при прокрутке вниз она заканчивается
    высота на окно браузера


    вот код
    Код:
    .header {
        height: 685px;
        color: #373737;
        background: url("img/bg.jpg");
        background-position: center center;
        background-repeat: none;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        background-size: cover;
        -o-background-size: cover;
    }
     
  2. iga

    iga

    Регистрация:
    6 фев 2014
    Сообщения:
    145
    Симпатии:
    20
    Как-то так чтоли?
    HTML:
    <div class="block1"></div>
    <div class="block2"></div>
    HTML:
    *{ height:100%;}
    .block1 {
    background: url("1920x1080_1.jpg");
        height: 100%;
        background-position: center center;
        background-repeat: none;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        background-size: cover;
        -o-background-size: cover;
    }
    .block2 {
    background: url("1920x1080_2.jpg");
        height: 100%;
        background-position: center center;
        background-repeat: none;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        background-size: cover;
        -o-background-size: cover;
    }
     
  3. etens1212

    etens1212

    Регистрация:
    1 май 2013
    Сообщения:
    320
    Симпатии:
    16
    когда ставлю
    *{ height:100%;}

    то header нормально

    но все стает height:100%
     
  4. Вячек

    Вячек

    Регистрация:
    24 мар 2015
    Сообщения:
    4
    Симпатии:
    0
    напишите так:

    body, html {
    height: 100%;
    }
    .block1 {
    background-image: url("img/bg.jpg");
    background-size: cover;
    background-position: center center;
    height: 100%;
    }

    остальной контент страницы выкладывайте после блока .block1
     
  5. etens1212

    etens1212

    Регистрация:
    1 май 2013
    Сообщения:
    320
    Симпатии:
    16

    не помогло(
     
  6. Marrie

    Marrie

    Регистрация:
    7 сен 2015
    Сообщения:
    50
    Симпатии:
    10
    body, html {
    height: 100%;
    min-height:100%;
    }
    .block1 {
    background-image: url("img/bg.jpg");
    background-size: cover;
    background-position: center center;
    height: 100%;min-height:100%; width:100%;
    }