Почему мое изображение не отображается Html?

Я написал этот короткий код, но мое фоновое изображение вообще не появляется .. это странно, потому что, если я изменяю, например, ширину и высоту с «px», это отображаетсяПочему мое изображение не отображается Html?

Im пытается отобразить фоновое изображение с полной длиной экрана и вставить в тег div любые предложения?

<!DOCTYPE HTML> 
<html> 
<head> 
     <meta http-equiv="Content-Type" content="text/html"; charset="utf-8"/> 
     <title>My Web Page</title> 

     <style> 



     .hola { 
      width:100%; 
      height: 100%; 
      background-image: url('../Img/imagenes/fotoportada.jpg'); 
      background-size: cover; 


      background-repeat: no-repeat; 
      } 

     </style> 
    </head> 

    <body> 
    <div class="hola"> 

    </div> 
    </body> 

</html>

источник

2014-01-25 user3013745

Вы уверены, что путь к вашему изображению прав? Как только я вижу относительные пути, он кричит неверный путь ко мне. –

Можете ли вы щелкнуть ссылку на изображение из элемента проверки в своем браузере? Воспитывает ли это изображение? –

Высота элемента определяется как 100%.

Это вычисляется относительно его родительского элемента, который равен auto (по умолчанию).

CSS определяет 100% из auto как auto, поэтому элемент такой же высокий, как он должен содержать его содержимое.

У него нет контента, поэтому это 0px.

Это не дает высоты, чтобы сделать изображение в.

Вы, вероятно, хотите установить min-height из 100% на элементе и все его предок (body и html).

источник

2014-01-25 16:02:09 Quentin

Спасибо .. вы правы .. это примерно высота, но установка высоты как минимальная высота: 100% не работал ..
тело, html { min-height: 100%; } .hola { ширина: 100%; высота: 100%; background-image: url ('../ Img/imagenes/fotoportada.jpg'); размер фона: обложка; background-repeat: no-repeat; } – user3013745

У div нет ширины или высоты, если у него нет содержимого, и если вы используете проценты. Фоновое изображение не считается содержимым.

источник

2014-01-25 16:06:13 uSeRnAmEhAhAhAhAhA

Просто добавьте положение: абсолютное; Она будет работать, как вы хотите

.hola { 
      width:100%; 
      height: 100%; 
      background-image: url('../Img/imagenes/fotoportada.jpg'); 
      background-size: cover; 
      position:absolute; 

      background-repeat: no-repeat; 
      }

источник

2014-01-25 16:13:06 shiny

спасибо !! это сработало :), если у вас есть 1 мин. не могли бы вы объяснить, почему это сработало? благодаря! – user3013745

свойство position должно быть там, чтобы дать некоторую команду элементу, когда вы предоставляете ширину, высоту, background-repeat, BY по умолчанию занимает статическую позицию. которые не могут влиять на высоту ширины и повторение фона ... – shiny

Вы можете попробовать:

body { 
    background: url('../Img/imagenes/fotoportada.jpg') no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
}

источник

2014-01-25 16:49:07 user3235263

Почему мое изображение не отображается Html?

ответ

Смежные вопросы