Ciao a tutti, sto cercando di rifare il mio sito personale che nativamente era costruito utilizzando i frame, per passare a una soluzione con i DIV. Ho cominciato a impostare la pagina index.html ma adesso mi trovo con il problema di dover linkare i menu senza fare tutte le volte il refresh di tutta la pagina.
In pratica il div logo e menù devono rimanere fermi mentre deve variare solo il contenuto del contenitore (scusate il gioco di parole).
Di seguito posto il codice HTML e CSS di quello che ho fatto finora. Grazie a chiunque di voi abbia la cortesia di aiutarmi.
Codice HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.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>
<link rel="stylesheet" href="css/reset.css" type="text/css" />
<link rel="stylesheet" href="css/style.css" type="text/css" />
</head>
<body>
<!--APRO WRAPPER-->
<div class="wrapper">
<!--APRO LOGO-->
<div class="logo">
LOGO
</div>
<!--CHIUDO LOGO-->
<!--APRO MENU-->
<div class="menu">
<a href="index.html">HOMEPAGE</a>
-
<a href="chi.html">CHI SIAMO</a>
-
<a href="cosa.html">COSA FACCIAMO</a>
-
<a href="contatti.html">CONTATTI</a>
</div>
<!--CHIUDO MENU-->
<!--APRO CONTENITORE-->
<div class="contenitore">
CONTENITORE
</div>
<!--CHIUDO CONTENITORE-->
<!-- CHIUDO WRAPPER-->
</div>
</body>
</html>
Codice:
@charset "UTF-8";
/* CSS Document */
body {}
img {}
a {}
a:hover {}
h1 {}
h2 {}
h3{}
/*CLASSI CHE DEFINISCONO IL MIO SITO*/
.wrapper {
background-color:#E5E5E5;
width:100%;
max-width:960px;
min-height:300px;
margin-left:auto;
margin-right:auto;
margin-top:25px;
}
.logo {
background-color:#EEE;
width:100%;
min-height:90px;
margin-bottom:10px;
}
.menu {
background-color:#DADADA;
width:100%;
min-height:40px;
margin-bottom:10px;
}
.contenitore {
background-color:#666;
width:100%;
min-height:400px;