gpt4 book ai didi

html - 如何在angular2的两个不同页面中有不同的背景图片?

转载 作者:太空宇宙 更新时间:2023-11-04 02:01:59 26 4
gpt4 key购买 nike

我有一个 Angular 2 应用程序,我必须在主页和其他页面上使用单独的背景图像,我在 index.html 上应用了图像以获得背景图像,但我需要在不同的页面上添加不同的图像。这是我的代码

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<base href="/">

<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">

<script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
<script src="resources/js/semantic.min.js"></script>
<script src="resources/js/slideshow.js"></script>
<link rel="stylesheet" type="text/css" class="ui" href="resources/css/semantic.css" />
<link rel="stylesheet" type="text/css" class="ui" href="resources/css/angularSwitch.css" />
<link rel="stylesheet" type="text/css" class="ui" href="resources/css/main.css" />
<link href="resources/css/datepicker3.css" rel="stylesheet" type="text/css">
<link href="resources/css/bootstrap.min.css" rel="stylesheet" type="text/css">
<link href="resources/css/styles.css" rel="stylesheet" type="text/css">
<script src="resources/js/jquery-1.11.1.min.js"></script>
<script src="resources/js/bootstrap.min.js"></script>
<script src="resources/js/chart.min.js"></script>
<script src="resources/js/chart-data.js"></script>
<script src="resources/js/easypiechart.js"></script>
<script src="resources/js/easypiechart-data.js"></script>
<script src="resources/js/bootstrap-datepicker.js"></script>
<script>
<!--Icons-->
<script src="resources/js/lumino.glyphs.js"></script>
</head>
<body style="background-image: url("resources/static/pic/slide_1.jpg");" >

<app-root></app-root>
</body>
</html>

请建议我如何实现这一目标。

最佳答案

如何在组件级别而不是在 index.html 中应用背景图像?然后每个组件可以有不同的背景图像。您甚至可以有一个单独的 css 文件,其中包含如下代码片段:

body { background-image: url("resources/static/pic/slide_1.jpg"); }

并将其包含在您希望该背景图像出现的每个组件“styleUrls”中。为您想要不同图像的组件使用不同的 css。

希望对你有帮助

关于html - 如何在angular2的两个不同页面中有不同的背景图片?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41593601/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com