html css
- Creatore Discussione bios37
- Data di inizio
Codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento senza titolo</title>
<style type="text/css">
#p1 {
background-image: url(p1.png);
background-repeat: no-repeat;
background-position: 0px 0px;
margin: 0px;
padding: 0px;
height: 399px;
width: 590px;
border: rgba(0,0,0,1.00) double 5px;
}
</style>
</head>
<body>
<div id="p1">
<img src="p2.png" width="590" height="399" alt=""/>
</div>
</body>
</html>
Il codice che ti ho dato mette già al centro l'omino bianco!
Scarica tutte e due le immagini e vedrai che funziona. Una è il cerchio blu p1.jpg l'altra è sotto p2.jpg, non si vede perchè l'omino è bianco come lo sfondo, ma se fai click con il destro e scegli salva immagine lo vedrai
Scarica tutte e due le immagini e vedrai che funziona. Una è il cerchio blu p1.jpg l'altra è sotto p2.jpg, non si vede perchè l'omino è bianco come lo sfondo, ma se fai click con il destro e scegli salva immagine lo vedrai
Codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento senza titolo</title>
<style type="text/css">
#p1 {
background-image: url(p1.png);
background-repeat: no-repeat;
background-position: 0px 0px;
margin: 0px;
padding: 0px;
height: 399px;
width: 590px;
border: rgba(0,0,0,1.00) double 5px;
}
#p2 {
background-image: url(p3.png);
background-repeat: no-repeat;
background-position: 0px 0px;
margin: 0px;
padding: 0px;
height: 590px;
width: 590px;
}
</style>
</head>
<body>
<div id="p1">
<img src="p2.png" width="590" height="399" alt=""/>
</div>
<br /><br />
<div id="p2">
<img src="p4.png" width="590" height="590" alt=""/>
</div>
</body>
</html>
Codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento senza titolo</title>
<style type="text/css">
#p1 {
background-image: url(p1.png);
background-repeat: no-repeat;
background-position: 0px 0px;
margin: 0px;
padding: 0px;
height: 399px;
width: 590px;
border: rgba(0,0,0,1.00) double 5px;
}
#p2 {
font-family: "Times New Roman";
font-size: 48px;
font-weight: bold;
color: rgba(255,255,255,1);
background-color: rgba(0,5,255,1);
text-align: center;
margin: 0px;
padding: 0px;
height: 65px;
width: 600px;
}
</style>
</head>
<body>
<div id="p1">
<img src="p2.png" width="590" height="399" alt=""/>
</div>
<div id="p2">Passaggio Pedonale</div>
</body>
</html>Questa è una cosa già più complicata perchè viene coinvolto anche Javascript e grafica per le immagini ma sopratutto il codice che ti ho dato va modificato dovendo usare immagini diverse.
Ma perchè fare tali operazioni su un segnale stradale?
Ma perchè fare tali operazioni su un segnale stradale?
è la seconda parte del esercizio affidatoci io sono riuscita a programmare in javascript queste funzioni ma non so dove devo inserirle al interno del codice ? e inoltre dove inserire le immagini nelle funzioni?
BIANCONERO
<img class="foto" src="biancoNero.jpg" id="foto" onMouseOver=caricaColore(); onMouseOut=caricaBiancoNero();>
RUOTA
function rotate(angolo, direzione)
{
if(direzione == "sinistra")
$('#image').rotateLeft(parseInt(angolo));
else
$('#image').rotateRight(parseInt(angolo));
}
</script>
MI puoi aiutare???:fonzie:
BIANCONERO
<img class="foto" src="biancoNero.jpg" id="foto" onMouseOver=caricaColore(); onMouseOut=caricaBiancoNero();>
RUOTA
function rotate(angolo, direzione)
{
if(direzione == "sinistra")
$('#image').rotateLeft(parseInt(angolo));
else
$('#image').rotateRight(parseInt(angolo));
}
</script>
MI puoi aiutare???:fonzie:
... Con quel codice No! Perchè è incompleto e non adatto a essere usato con dei pulsanti.
Poi bisogna avere sotto occhio tutta la pagina e relativi scrpt. Non si può fare le cose a pezzi in questo modo, prima i cartelli poi la barra ora i pulsanti, una pagina deve essere sviluppata tutta insieme uniformemente.
Per ruotare basta usare i CSS3.
Per cambiare l'immagine dal colore al bianco&nero e viceversa basta una semplice istruzione javascript document.getElementById("id").
Vedi un po' se riesci a fare qualche cosa! L'esercizio dovresti farlo tu non io!
Poi scusa la domanda ma chi è che da esercizi così ....
Discussioni simili
