Question

我想将此图片作为div下的背景，其中出现文字G.E.D S.A.L.C 但是它不起作用..尽管我已经尝试过CSS，甚至通过以下方法强制执行所有操作：

<body bgcolor="blue" background="images/sfondo.png">

这是代码：

<!DOCTYPE html>
<?php 
	session_start();
    if(!isset($_SESSION["username"])){
    	header('location: ../index.php');
    }else
    {
    
?>
<html>
	<head>
    <title>G.E.D.</title>
		<link href="../paginaIniziale/css/bootstrap-4.0.0.css" rel="stylesheet">
		<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
		<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato">
		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
		<style>
			.bgimg-1{
				background-attachment: fixed;
				background-position: center;
				background-repeat: no-repeat;
				background-size: cover;
				background-image: url("images/sfondo.png");
				min-height: 100%;
			}
		</style>
	</head>
	<body bgcolor="blue" background="images/sfondo.png">
		<div class="w3-top">
			<div class="w3-bar w3-padding w3-card" style="background-color: #ffc107">
				<h1>G.E.D. - S.A.L.C.</h1>
			</div>			
		</div>
			<div class="w3-display-middle w3-contener" >
				<a class="w3-center w3-padding-large w3-black w3-xlarge w3-wide" style="margin-left: 22px;">Seleziona un operazione</a>
				<div class="w3-center" style="margin-top: 40px;">
					<a href="../pagineHtml/inserimento/inserimentoGenerale/inserimentoCantiere.php" class="w3-bar-item w3-button"><i class="fa fa-home"></i>Milano </a>
					<a href="azioniVisualizza/sceltaCantiere.php" class="w3-bar-item w3-button"><i class="fa fa-home"></i>Roma  </a>
					
				</div>
			</div>
	</body>
</html>
<?php } ?>

这是图片... BackGround IMAGE

照片放置在正确的网址中

有人知道如何帮助我吗？ PS ..我承认我已经使用了模板啊哈哈哈

Answer 1

您创建了一个CSS类名.bgimg-1，但尚未在任何地方使用它。您可能需要<body class="bgimg-1">才能为其分配CSS。

还应确保文件位于指定的路径。您可以通过检查<body>并单击背景URL在新选项卡中将其打开，以在Chrome开发工具中查找。要么显示图片，要么会出现404错误。

Answer 2

将创建的类添加到body元素。

<!DOCTYPE html>
<?php 
	session_start();
    if(!isset($_SESSION["username"])){
    	header('location: ../index.php');
    }else
    {
    
?>
<html>
	<head>
    <title>G.E.D.</title>
		<link href="../paginaIniziale/css/bootstrap-4.0.0.css" rel="stylesheet">
		<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
		<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato">
		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
		<style>
			.bgimg-1{
				background-attachment: fixed;
				background-position: center;
				background-repeat: no-repeat;
				background-size: cover;
				background-image: url("https://i.stack.imgur.com/TYX0B.png");
				min-height: 100%;
			}
		</style>
	</head>
	<body class="bgimg-1" bgcolor="blue" background="images/sfondo.png">
		<div class="w3-top">
			<div class="w3-bar w3-padding w3-card" style="background-color: #ffc107">
				<h1>G.E.D. - S.A.L.C.</h1>
			</div>			
		</div>
			<div class="w3-display-middle w3-contener" >
				<a class="w3-center w3-padding-large w3-black w3-xlarge w3-wide" style="margin-left: 22px;">Seleziona un operazione</a>
				<div class="w3-center" style="margin-top: 40px;">
					<a href="../pagineHtml/inserimento/inserimentoGenerale/inserimentoCantiere.php" class="w3-bar-item w3-button"><i class="fa fa-home"></i>Milano </a>
					<a href="azioniVisualizza/sceltaCantiere.php" class="w3-bar-item w3-button"><i class="fa fa-home"></i>Roma  </a>
					
				</div>
			</div>
	</body>
</html>
<?php } ?>

Answer 3

您已经设置了bgimg-1类。您需要将类添加到body标签。另外，您无需在body标签中使用background =“ images / sfondo.png”强制使用。

  <body class="bgimg-1" bgcolor="blue">

检查下面的完整代码-

<!DOCTYPE html>
<?php 
	session_start();
    if(!isset($_SESSION["username"])){
    	header('location: ../index.php');
    }else
    {
    
?>
<html>
	<head>
    <title>G.E.D.</title>
		<link href="../paginaIniziale/css/bootstrap-4.0.0.css" rel="stylesheet">
		<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
		<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato">
		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
		<style>
			.bgimg-1{
				background-attachment: fixed;
				background-position: center;
				background-repeat: no-repeat;
				background-size: cover;
				background-image: url("https://i.stack.imgur.com/TYX0B.png");
				min-height: 100%;
			}
		</style>
	</head>
	<body class="bgimg-1">
		<div class="w3-top">
			<div class="w3-bar w3-padding w3-card" style="background-color: #ffc107">
				<h1>G.E.D. - S.A.L.C.</h1>
			</div>			
		</div>
			<div class="w3-display-middle w3-contener" >
				<a class="w3-center w3-padding-large w3-black w3-xlarge w3-wide" style="margin-left: 22px;">Seleziona un operazione</a>
				<div class="w3-center" style="margin-top: 40px;">
					<a href="../pagineHtml/inserimento/inserimentoGenerale/inserimentoCantiere.php" class="w3-bar-item w3-button"><i class="fa fa-home"></i>Milano </a>
					<a href="azioniVisualizza/sceltaCantiere.php" class="w3-bar-item w3-button"><i class="fa fa-home"></i>Roma  </a>
					
				</div>
			</div>
	</body>
</html>
<?php } ?>

Answer 4

首先，属性“ background”和“ bgcolor”是旧方法，并且不符合标准，因此应改用CSS background / background-color属性。

第二，阅读评论似乎您的路径不正确。

祝你好运！

Answer 5

请在body标签中添加class属性像这样

<body class="bgimg-1">

或仅将其替换为

问候。 kevil

更改背景-image丝毫HTML和CSS

5 个答案: