Background-image non funzionante

di il
1 risposte

Background-image non funzionante

Salve ragazzi,
da pochi giorni mi sono "inoltrato" nel mondo della programmazione Web, incuriosito dall' HTML5 e CSS3 ecc... A tempo perso volendo potenziare le mie abilità con le <ul> </ul> e le <ol> </ol>, ho iniziato a costruire una specie di sito web di abbigliamento (sono agli inizi ancora eh) e piano piano imparo sempre cose nuove, solo che però mi sa che sovrascrivo tutto quello appreso in precedenza, perché non riesco a far comparire lo sfondo nella pagina di questo maledetto sito, ho provato in tutti i modi, sia inserendo il tag img src nel foglio HTML, sia in quello css, ma sta cosa non s'ha da fare ....
Adesso vi posto sia il codice.html e sia quello.css, nella speranza che qualcuno di voi sia così gentile da rispondermi appena possibile
<!DOCTYPE html>

<html>
<head>
    <meta charset="UTF-8" />
    <title>SportingWear.com</title>   
   
    <link rel="stylesheet" type="text/css" href="stileDIVINACOMMEDIA.css">
    <p class="titolo">
        Sporting Wear ™
    </p>
</head>

<body>
   
    <div class= "corpo">
        
        <header class="header"> <h1 style="font-size: 30px">•M E N U•</h1></header>
        
<ul class="menu">
    <li class="uomo"> Uomo
    <ul class="sub-menu">
        <li>Nuovi arrivi</li>
        <li><a style="text-decoration: none; color: black" href= https://eu.gymshark.com/collections/t-shirts-tops/mens> T-shirt e canotte</a></li>
        <li>Pantaloncini</li>
        <li>Tute</li>
        <li>Felpe</li>
        <li>Cappelli</li>
        <li>Accessori</li>
        <li class="ultimo-sub">Integratori</li>
    </ul>
    </li>
    
    <li class="altro">Dove siamo
    <ul class="sub-menu2">
        <li class="ultimo-sub"><a style="text-decoration: none; color: black" href= https://www.google.it/maps/place/Traversa+3+Via+Giuseppe+Garibaldi,+89044+Locri+RC/@38.2370045,16.2562519,16.25z/data=!4m5!3m4!1s0x131526cf2c3a3abb:0x2b2ac73731c509ab!8m2!3d38.2379521!4d16.2568978>Negozio a Locri</a></li>
    </ul>
    </li>
    
    <li class="donna">Donna</li>
    <li class="bambino">Bambino
    <ul class="sub-menu">
        <li>Nuovi Arrivi</li>
        <li>Scarpe</li>
        <li>Felpe</li>
        <li>Pantaloni</li>
        <li class="ultimo-sub">Magliette</li>
        
        
            
        
    </ul>
    </li>
    
</ul>

</div>
</body>
</html>
E ADESSO IL FOGLIO DI STILE...

.titolo{ font-size:50px;
         font-family: "Planet Kosmos", "BankGothic Md BT";
         text-align: center;
        background-color: #8b0000;
        }




.body{
	background-image:url(file:///C|/Users/antonio/Pictures/Saved%20Pictures/asus_republic_of_gamers_background-wallpaper-1366x768.jpg);
}

  * {
	margin: 0;
	padding: 0;
}

.header{
	font-family: "Mesquite Std";
}

.corpo{
	margin-top: 50px;
	margin-left: 250px;
}

.uomo{
    font-family:"Brush Script Std";
    font-size: 20PX;
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
}

.altro{
    font-family:"Brush Script Std";
    font-size: 20PX;
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
}

.donna{
    font-family:"Brush Script Std";
    font-size: 20PX;
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
}

.bambino{
    font-family:"Brush Script Std";
    font-size: 20PX;
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
}

.menu li{
    cursor: pointer;
    display: block;
	float: left;
	width: 175px;
	height: 50px;
	line-height: 50px;
	text-align: center;
	color: black;
	border-right: 1px solid black;
    background: -webkit-linear-gradient(top, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%);
	background: -moz-linear-gradient(top, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%);
	background: -o-linear-gradient(top, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%);
	background: -ms-linear-gradient(top, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%);
}
.sub-menu2 li:hover{
    
    text-decoration: underline;
    cursor: pointer;
	width: 175px;
    text-align: center;
    background: -webkit-radial-gradient(center, ellipse cover, #f7fbfc 1% , #8b0000 100%);
	background: -moz-radial-gradient(center, ellipse cover, #f7fbfc 1%, #8b0000 100%);
	background: -o-radial-gradient(center, ellipse cover, #f7fbfc 1%, #8b0000 100%);
	background: -ms-radial-gradient(center, ellipse cover, #f7fbfc 1%, #8b0000 100%);
	transition: all 0.1s ease 0s;
	-webkit-transition: all 0.1s ease 0s;
	-moz-transition: all 0.1s ease 0s;
	-o-transition: all 0.1s ease 0s;
	-ms-transition: all 0.1s ease 0s;
    
}
.sub-menu li{
	border-top: 1px dotted black;
}
.sub-menu li:hover{
    text-decoration: underline;
    cursor: pointer;
	width: 175px;
    text-align: center;
	background: -webkit-radial-gradient(center, ellipse cover, #f7fbfc 0%, #a21f1f 100%);
	background: -moz-radial-gradient(center, ellipse cover, #f7fbfc 0%, #a21f1f 100%);
	background: -o-radial-gradient(center, ellipse cover, #f7fbfc 0%, #a21f1f 100%);
	background: -ms-radial-gradient(center, ellipse cover, #f7fbfc 0%, #a21f1f 100%);
	transition: all 0.1s ease 0s;
	-webkit-transition: all 0.1s ease 0s;
	-moz-transition: all 0.1s ease 0s;
	-o-transition: all 0.1s ease 0s;
	-ms-transition: all 0.1s ease 0s;
}
.sub-menu2{visibility: hidden;}

.sub-menu2 li{
    border-top: 1px dotted black;
}

.sub-menu{ visibility: hidden;
}
.menu li:hover .sub-menu2{
    visibility: visible;
}
.menu li:hover .sub-menu{
	visibility: visible;
}
.ultimo-sub{
    
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
}

1 Risposte

Devi accedere o registrarti per scrivere nel forum
1 risposte