I'm trying to put a background image but I can not. Can someone help me?
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
body, html {
width: 100%;
}
body {
background-image: url("img/pizza.jpg");
background-repeat: no-repeat;
}
nav#menu ul {
list-style: none;
text-transform: uppercase;
}
nav#menu li {
display: inline-block;
background-color: #006400;
padding:0,30%;
margin: 5%;
transition: background-color 1s;
}
nav#menu li:hover {
background-color:#32CD32;
}
nav#menu a {
color: #FFD700;
text-decoration: none;
}
<!DOCTYPE html>
<html lag="pt-br">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="style/style.css">
<title>Pizzaria Santa Tartaruga</title>
</head>
<body>
<header>
<div id="log"><img src="img/santatmnt.png" height="100" width="100" alt="Pizzari Santa Tartaruga" title="PIZZARIA SANTA TARTARUGA"></div>
<h1><a href="">Pizzaria Santa Tartaruga</a></h1>
</header>
<div id="me">
<nav id="menu">
<ul>
<li id="ho"><img src="img/raphael.png" height="100" width="100" alt="Raphael" title="RAPHAEL"><a href="">Home</a></li>
<li id="ca"><img src="img/michelangelo.png" height="100" width="100" alt="Michelangelo" title="MICHELANGELO"><a href="">Cardápio</a></li>
<li id="po"><img src="img/leonardo.png" height="100" width="100" alt="Leonardo" title="LEONARDO"><a href="">Pedidos Online</a></li>
<li id="co"><img src="img/donatello.png" height="100" width="100" alt="Donatello" title="DONATELLO"><a href="">Contato</a></li>
<ul>
</div>
</nav>
<section>
<h1> Venha curtir uma aventura ao lado das tarugas mutantes mais amadas do mundo!
E o que não vai faltar nessa aventura é muita pizza!</h1>
</section>
<footer>
<div> Tel:(21)2243-5243(8hs ás 24hs)</div>
</footer>
.