Итак, я настраиваю свою собственную веб-страницу (она еще не запущена) и у меня возникают проблемы с добавлением фонового изображения.Я исследовал сеть и этот сайт, в частности, в поисках возможных решений моей проблемы, но без преобладания.Я понимаю, как добавить фоновое изображение не с помощью угловой структуры, а через простую HTML-страницу, где все хранится в одном HTML-файле.Тем не менее, когда я пробую это в angular
Framework, все это разваливается.(имеется в виду, что изображение либо не отображается, либо отображается и просто не соответствует стилям, установленным для изображения)
Прежде чем что-то пытаться, я зашел в свой файл angular.json
и изменил «* 1005».* »К следующему:« assets »: [« src / favicon.ico »,« src / assets »,« src / assets / images »-> я добавил это, так что angular знает, где найти изображение],
Первый подход: (этот подход действительно работает в моем простом одностраничном HTML-файле) В HTML-файле:
<div class="bgimg-1">*usually i'd put my navbar here*</div>
В CSS
файле:
.bgimg-1 {
background-image: url("me_copy.jpg");
height: 100%;
width: 100%;
position: relative;
opacity: 0.8;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
Второй подход:
Чтобы убедиться, что у меня правильный путь, я даже попытался разместить изображение на веб-странице, не заботясь о стилях или чем-то еще.Путь, который я работал, чтобы отобразить изображение.Затем, когда я начал стилизовать его, изображение не подчинялось всем моим ограничениям стиля и просто проходило мимо правой и нижней сторон моей веб-страницы.Снова, я попробовал это на моей другой веб-странице, используя то же самое изображение, которое использует только один документ HTML для всего, и это работало.Похоже, что при воспроизведении нескольких файлов (не все в одном месте) все это разваливается.
Чтобы дать вам представление о моих ожиданиях посещение Мои ожидания касаются веб-страницычтобы:
отображать фоновое изображение, которое соответствует экрану, например, при первом опубликованном подходе
(это не такНажимая на вопрос, я просто поражен, что я не мог понять это) для любых других фоновых изображений, чтобы соответствовать размеру веб-страницы и не переполняться.Любые предложения приветствуются.