HELP ME: explication site internet en html
Hors ligneBonsoir1000 Le 23/04/2016 à 14:02 Profil de Bonsoir1000 Configuration de Bonsoir1000

Bonjour je dois comprendre le fonctionnement de cette programmation de site internet en html et malgré de très nombreuses recherches je n'y comprends rien du tout...

Si quelqu'un pouvait m'aider à le décortiquer et en expliquer le fonctionnement ça m'aiderait beaucoup

Il y a 4 fichiers:

- ACCUEIL :

<html>

<head>

<meta charset="utf-8"/>

<title>PLONGEUR DU CERI</title>

</head>

<style>

/* BANDEAU */

th

{

background: #eee url('bandeau.jpg') no-repeat center;

background-size: 100% 100%;

}

th img

{

position: relative;

float: left;

}

body

{

font-family: Arial;

}

th h1

{

color:white;

transition: transform .4s linear,color .2s ease-in-out;

}

th h1:hover

{

transform: scale(1.05);

color: #FF4000;

}

/* MENU */

ul a

{

text-decoration: none;

color: #eee;

transition: color .3s linear;

}

ul a:hover

{

color: #FF4000;

}

ul li

{

list-style: none;

list-style-image: url('scuba.png');

transition: list-style-image .3s linear;

}

ul li:hover

{

list-style-image: url('scuba_hover.png');

}

/* CORPS */

td p

{

text-align: left;

margin: 0 0 5% 2%;

font-weight: bold;

font-family: arial;

}

.img_up

{

transition: transform .4s linear;

}

.img_up:hover

{

transform: scale(1.3);

}

</style>

<body>

<table border="7px" rules="groups" width="100%">

<colgroup span="1"></colgroup>

<colgroup span="1"></colgroup>

<thead>

<th height="200px" colspan="2" style="color:red"><h1><font size="10s"><u> CLUB DE PLONGEE DU CERI</u></font></h1></th>

</thead>

<tbody>

<tr>

<td width="15%" style="color:#fff"; background="bg-menu.jpg"; align="center"><h2>MENU</h2></td>

<td height="530px"S align="center" style="color:#fff"; background="accueil.jpg";><h1></h1></td>

</tr>

<tr>

<td style="color:#fff"; background="bg-menu.jpg">

<ul>

<li>Accueil

<ol><li><a href="#">Haut de page</li>

<li><a href="#bas">Bas de page</li></ol></li>

<li><a href="Le_club.html">Le Club</a></li>

<li><a href="Loisirs.html">Loisirs</a></li>

<li><a href="Contact.html">Contact</a></li>

</ul>

<br><br>

<ul>

  • FFESSM
  • CERI
  • </ul>

    </td>

    <td align="center" style="color:#fff"; background="bg.gif";><br><br><img class="img_up" src="plongee_accueil.jpg"><p>

    <h1 align="center"><FONT color="#00BFFF">ACCUEIL</FONT></h1><br>

    <FONT color="#00BFFF">LE CLUB DE PLONGEE DU CERI</FONT> a été créé à l'intention d'un projet de conception informatique.

    <br><br>

    Notre club est ouvert à tout le monde sans restriction d’âge, de condition physique et même de handicap…

    <br><br>

    Notre activité de formation de plongée a lieu dans différentes piscines de du CERI.

    <br><br>

    L'obtention des niveaux de plongée doit être l'aboutissement de compétence de manière à ce que l'apprentissage reste un loisir !

    <br><br>

    Enfin, vous devez retenir que la plongée sous-marine en club associatif a pour objet d'être accessible à tous mais nécessite un investissement de chacun.

    <br><br>

    Plus que des mots, nous vous invitons à venir gratuitement tester l’ambiance et le fonctionnement de notre ecole/club de plongée au CERI !!!<br><br></td>

    </tr>

    </tbody>

    <tfoot id="bas">

    <td style="color:#fff;background-color:#005c7f;" background="bg-bas.jpg" height="50" colspan="2" align="center"><a href="mailto:tom.salgues09@gmail.com?subject:Votre%20page%internet">SALGUES TOM,ANIS BAIT</a>©, 13/04/2016 CERI</td>

    </tfoot>

    </table>

    </body>

    </html>

    - CONTACT :

    <html>

    <head>

    <meta charset="utf-8"/>

    <title>PLONGEUR DU CERI</title>

    </head>

    <style>

    /* BANDEAU */

    th

    {

    background: #eee url('bandeau.jpg') no-repeat center;

    background-size: 100% 100%;

    }

    th img

    {

    position: relative;

    float: left;

    }

    body

    {

    font-family: Arial;

    }

    th h1

    {

    color:white;

    transition: transform .4s linear,color .2s ease-in-out;

    }

    th h1:hover

    {

    transform: scale(1.05);color: FF4000;

    }

    /* MENU */

    ul a

    {

    text-decoration: none;

    color: #eee;

    transition: color .3s linear;

    }

    ul a:hover

    {

    color: FF4000;

    }

    ul li

    {

    list-style: none;

    list-style-image: url('scuba.png');

    transition: list-style-image .3s linear;

    }

    ul li:hover

    {

    list-style-image: url('scuba_hover.png');

    }

    /* CORPS */

    td p

    {

    text-align: left;

    margin: 0 0 5% 2%;

    font-weight: bold;

    font-family: arial;

    }

    .img_up

    {

    transition: transform .4s linear;

    }

    .img_up:hover

    {

    transform: scale(1.3);

    }

    </style>

    <body>

    <table border="7px" rules="groups" width="100%">

    <colgroup span="1"></colgroup>

    <colgroup span="1"></colgroup>

    <thead>

    <th height="200px" colspan="2" style="color:red"><h1><font size="10s"><u> CLUB DE PLONGEE DU CERI</u></font></h1></th>

    </thead>

    <tbody>

    <tr>

    <td width="15%" style="color:#fff"; background="bg-menu.jpg"; align="center"><h2>MENU</h2></td>

    <td height="349px" align="center" style="color:#fff"; background="contact.jpg";></td>

    </tr>

    <tr>

    <td style="color:#fff"; background="bg-menu.jpg">

    <ul>

    <li><a href="Accueil.html">Accueil</a></li>

    <li><a href="Le_club.html">Le Club</a></li>

    <li><a href="Loisirs.html">Loisirs</a></li>

    <li>Contact

    <ol><li><a href="#">Haut de page</li>

    <li><a href="#bas">Bas de page</li></ol></li>

    </ul>

    <br><br>

    <ul>

  • FFESSM
  • CERI
  • </ul>

    </td>

    <td margin-lest="50" style="color:#fff"; background="bg.gif";> <h1><FONT color="#00BFFF">CONTACT</FONT></h1>

    <p>

    Adresse postale :<br>

    Centre d'Enseignement et de Recherche en Informatique (CERI)<br>

    Agroparc - BP 91228<br>

    339, chemin des Meinajariès<br>

    84911 Avignon cedex 9<br><br>

    Téléphone : (+33/0)490843500<br>

    Fax : (+33/0)490843501<br><br>

    Courrier électronique : <br>

    Informations générales : ceri-info(à )univ-avignon.fr<br>

    Informations candidatures et inscriptions : ceri-candidature(Ã )univ-avignon.fr<br><br>

    Pour contacter une personne en particulier : prenom.nom@univ-avignon.fr<br><br><br>

    Direction du CERI<img class="img_up" align="right" width="700" src="ceri.gif">

    <ul><li>Directeur du CERI : Fabrice Lefèvre</li>

    <li>Directrice des études : Corinne Fredouille</li>

    <li>Directeur du laboratoire de recherche - LIA : Georges Linares</li>

    <li>Responsable administratif : Catherine Bonansera</li></ul><br>

    Licence Informatique<br>

    <ul><li>Responsable : Serigne Gueye</li>

    <li>Responsable L1 : Philippe Gilles</li>

    <li>Responsable L2 : Philippe Gilles</li>

    <li>Responsable L3 : Serigne Gueye</li>

    <li>Responsable administratif : Laurence Gilles</li></ul><br><br>

    Master Informatique<br>

    <ul><li>Responsable : Stéphane Huet</li>

    <li>Responsable Spécialité ILSEN : Stéphane Huet, Michel Benoit</li>

    <li>Responsable Spécialité RISM : Rachid Elazouzi</li>

    <li>Responsable administratif : Laurence Gilles</li></ul><br><br>

    Alternance<br><img class="img_up" align="right" width="700" src="ceri2.jpg">

    <ul><li>Responsable : Corinne Fredouille</li>

    <li>Responsable Adjoint : Patrick Nasarre</li>

    <li>Responsable administratif : Catherine Bonansera</li></ul><br><br>

    Diplôme Universitaire (DU) en Ingénierie du Web<br>

    <ul><li>Responsable : Sophie Nabitz</li></ul><br><br>

    Relation avec les entreprises - Stages & soutenances alternance<br>

    <ul><li>Responsable : Patrick Nasarre

    <li>Responsable administratif : Mireille Rozier</li></ul><br><br>

    Contacts Anciens étudiants - Soirée des anciens<br>

    <ul><li>ceri-informatique(Ã )univ-avignon.fr </li>

    <li>anciens-informatique(Ã )listes.univ-avignon.fr</li></ul>

    </p>

    </td>

    </tr>

    </tbody>

    <tfoot id="bas">

    <td style="color:#fff;background-color:#005c7f;" background="bg-bas.jpg" height="50" colspan="2" align="center"><a href="mailto:tom.salgues09@gmail.com?subject:Votre%20page%internet">SALGUES TOM,ANIS BAIT</a>©, 13/01/2016 CERI</td>

    </tfoot>

    </table>

    </body>

    </html>

    - LE CLUB :

    <html>

    <head>

    <meta charset="utf-8"/>

    <title>PLONGEUR DU CERI</title>

    </head>

    <style>

    /* BANDEAU */

    th

    {

    background: #eee url('bandeau.jpg') no-repeat center;

    background-size: 100% 100%;

    }

    th img

    {

    position: relative;

    float: left;

    }

    body

    {

    font-family: Arial;

    }

    th h1

    {

    color:white;

    transition: transform .4s linear,color .2s ease-in-out;

    }

    th h1:hover

    {

    transform: scale(1.05);color: FF4000;

    }

    /* MENU */

    ul a

    {

    text-decoration: none;

    color: #eee;

    transition: color .3s linear;

    }

    ul a:hover

    {

    color: FF4000;

    }

    ul li

    {

    list-style: none;

    list-style-image: url('scuba.png');

    transition: list-style-image .3s linear;

    }

    ul li:hover

    {

    list-style-image: url('scuba_hover.png');

    }

    /* CORPS */

    td p

    {

    text-align: left;

    margin: 0 0 5% 2%;

    font-weight: bold;

    font-family: arial;

    }

    .img_up

    {

    transition: transform .4s linear;

    }

    .img_up:hover

    {

    transform: scale(1.3);

    }

    </style>

    <body>

    <table border="7px" rules="groups" width="100%">

    <colgroup span="1"></colgroup>

    <colgroup span="1"></colgroup>

    <thead>

    <th height="200px" colspan="2" style="color:red"><h1><font size="10s"><u> CLUB DE PLONGEE DU CERI</u></font></h1></th>

    </thead>

    <tbody>

    <tr>

    <td width="15%" style="color:#fff"; background="bg-menu.jpg"; align="center"><h2>MENU</h2></td>

    <td height="530px" align="center" style="color:#fff"; background="club.jpg";></td>

    </tr>

    <tr>

    <td style="color:#fff"; background="bg-menu.jpg">

    <ul>

    <li><a href="Accueil.html">Accueil</a></li>

    <li>Le Club

    <ol><li><a href="#">Haut de page</li>

    <li><a href="#bas">Bas de page</li></ol></li>

    <li><a href="Loisirs.html">Loisirs</a></li>

    <li><a href="Contact.html">Contact</a></li>

    </ul>

    <br><br>

    <ul>

  • FFESSM
  • CERI
  • </ul>

    </td>

    <td align="center" style="color:#fff"; background="bg.gif";> <h1><FONT color="#00BFFF">Club de plongée du CERI</FONT></h1>

    <p>

    <FONT color="#00BFFF">Qui sommes nous?</FONT>

    <img class="img_up" align="left" src="personnes.jpg">

    <br><br>

    <u>Fiche d'identité de notre Ecole de Plongée à Nîmes :</u><br>

    Club Associatif loi 1901.<br><br>

    Préfecture du Gard n°W302006128<br><br>

    Agrément Ministériel Sport n°58 S 1756/10<br>

    Agrément FFESSM n°45.30.0385<br>

    Agrément FFH n°11/050/3580<br>

    Assurance R.C.P LOL n°13.325.756.05<br>

    Siret 52758696300017 - APE 9342Z<br>

    339, chemin des Meinajariès 84911 AVIGNON cedex 9<br>

    Tel .04 90 84 35 00 Fax.04 90 84 35 01<br>

    </p><br><br><br><br>

    <p>

    <FONT color="#00BFFF"> Notre fonctionnement et état d'esprit !</FONT><br><br>

    Nous savons qu'adhérer à une association, et encore plus quand il s'agit de faire de la plongée, n'est pas forcement simple. <br><br>

    Le fondement et l'histoire de notre organisation a toujours été d'intégrer, sans jamais faire de différence, les nouveaux adhérents quelque soit l'âge, la profession, la condition physique, etc... Que vous soyez sportif ou non, venez à notre rencontre pour plonger à Nimes ! <br><br>

    Notre but n'est pas financier, c'est d'ailleurs pour cette raison que les moniteurs et membres du CA sont TOTALEMENT bénévoles et que notre adhésion annuelle est à partir de 50 € ....

    <br><br><br>

    <FONT color="#00BFFF"> Adresse du local</FONT><br><br>

    565 C ancienne route de Jean-Moulin à Avignon au rez de chaussée (Panneau Halte garderie Les Courlis)

    </p>

    </td>

    </tr>

    </tbody>

    <tfoot id="bas">

    <td style="color:#fff;background-color:#005c7f;" background="bg-bas.jpg" height="50" colspan="2" align="center"><a href="mailto:tom.salgues09@gmail.com?subject:Votre%20page%internet">SALGUES TOM,BAIT ANIS</a>©, 13/01/2016 CERI</td>

    </tfoot>

    </table>

    </body>

    </html>

    - LOISIRS :

    <html>

    <head>

    <meta charset="utf-8"/>

    <title>PLONGEUR DU CERI</title>

    </head>

    <style>

    /* BANDEAU */

    th

    {

    background: #eee url('bandeau.jpg') no-repeat center;

    background-size: 100% 100%;

    }

    th img

    {

    position: relative;

    float: left;

    }

    body

    {

    font-family: Arial;

    }

    th h1

    {

    color:white;

    transition: transform .4s linear,color .2s ease-in-out;

    }

    th h1:hover

    {

    transform: scale(1.05);

    color: #FF4000;

    }

    /* MENU */

    ul a

    {

    text-decoration: none;

    color: #eee;

    transition: color .3s linear;

    }

    ul a:hover

    {

    color:#FF4000;

    }

    ul li

    {

    list-style: none;

    list-style-image: url('scuba.png');

    transition: list-style-image .3s linear;

    }

    ul li:hover

    {

    list-style-image: url('scuba_hover.png');

    }

    /* CORPS */

    td p

    {

    text-align: left;

    margin: 0 0 5% 2%;

    font-weight: bold;

    font-family: arial;

    }

    .img_up

    {

    transition: transform .4s linear;

    }

    .img_up:hover

    {

    transform: scale(1.3);

    }

    .img_up

    {

    transition: transform .4s linear;

    }

    .img_up:hover

    {

    transform: scale(1.3);

    }

    </style>

    <body>

    <table border="7px" rules="groups" width="100%">

    <colgroup span="1"></colgroup>

    <colgroup span="1"></colgroup>

    <thead>

    <th height="200px" colspan="2" style="color:red"><h1><font size="10s"><u> CLUB DE PLONGEE DU CERI</u></font></h1></th>

    </thead>

    <tbody>

    <tr>

    <td width="15%" style="color:#fff"; background="bg-menu.jpg"; align="center"><h2>MENU</h2></td>

    <td height="350px" align="center" style="color:#fff"; background="loisir.jpg";>

    </tr>

    <tr>

    <td style="color:#fff"; background="bg-menu.jpg">

    <ul>

    <li><a href="Accueil.html">Accueil</a></li>

    <li><a href="Le_club.html">Le Club</a></li>

    <li>Loisirs

    <ol><li><a href="#">Haut de page</li>

    <li><a href="#bas">Bas de page</li></ol></li>

    <li><a href="Contact.html">Contact</a></li>

    </ul>

    <br><br>

    <ul>

  • FFESSM
  • CERI
  • </ul>

    </td>

    <td align="center" style="color:#fff"; background="bg.gif";>

    <h1><FONT color="#00BFFF">LOISIRS - SORTIE WE</FONT></h1>

    <p><FONT color="#00BFFF">Deux types de sorties vous sont proposées :</FONT><br><br>

    Techniques : elles sont organisées en début d’année, soit à la journée soit sur un weekend end. Elles sont ouvertes à tous ceux qui préparent leurs niveaux ainsi qu’à tous ceux qui les accompagnent.

    Loisirs : ouvertes à tous les adhérents, tous niveaux confondus. Un planning sera distribués en début d’année, les lieux seront communiqués au fur et à mesure.<br>

    Pour chaque sortie, un descriptif du séjour et de son déroulement sera remis 1 mois avant.<br><br>

    L'organisation :<br><br>

    Date et lieu d’inscription :<br>

    Les inscriptions au sortie loisirs seront closes 20 jours avant la sortie auprès des organisateurs ou directement aux séances de piscine.<br><br>

    Mode d’inscription :<br>

    Toute inscription devra être formulée au moyen d’un mail. La validation se fera après réception d’un chèque d’arrhes.<br><br>

    Le club propose la location de matériel pour chaque sortie faites dans le cadre du club.<br><br>

    Le versement par chèque correspondant aux arrhes à verser, devra être joint à la feuille d’inscription et donné aux organisateurs.<br>

    Rappel : les arrhes seront encaissées même après un désistement quel qu’il soit du participant - sauf en cas de force majeure.<br><br><br>

    <img class="img_up" align="right" width="700" src="loisir-2.jpg">

    <FONT color="#00BFFF">Voici les sorties prévues cette année :</FONT><br><br>

    28 et 29 septembre 2013 : Lavandou<br>

    12 et 13 octobre 2013 : Annecy<br>

    24 novembre 2013 : Marseille<br>

    22 décembre 2013 : Plongée de Noël<br>

    11 et 12 janvier 2014 (salon de la plongée)*<br>

    26 janvier 2014<br>

    23 février 2014 : Frontignan<br>

    16 mars 2014 : Marseille<br>

    27 avril 2014 : Cassis<br>

    21 et 22 juin 2014 (We pour tous – Handis et Valide) <br><br>

    <FONT color="#00BFFF">Voici un rappel de la saison passée :</FONT><br><br>

    16 septembre 2012 : La Ciotat<br>

    14 octobre 2012 : Port Cros<br>

    25 novembre 2012 : Pointe Rouge<br>

    16 décembre 2012 : Marseille<br>

    12 et 13 janvier 2013 (salon de la plongée)*<br>

    17 février 2013<br>

    10 mars 2013 : Chamrousse (plongée sous glace)<br>

    21 avril 2013 : St Mandrier<br>

    22 et 23 juin : Estartit (We pour tous – Handis et Valide) <br>

    *Ce salon se déroule Porte de Versailles à Paris. Nous vous laissons<br> organiser vos transports et couchage. Nous retrouverons devant le salon vers 10h30 le samedi matin.</p></td>

    </tr>

    </tbody>

    <tfoot id="bas">

    <td style="color:#fff;background-color:#005c7f;" background="bg-bas.jpg" height="50" colspan="2" align="center"><a href="mailto:tom.salgues09@gmail.com?subject:Votre%20page%internet">SALGUES TOM,BAIT ANIS</a>©, 13/01/2016 CERI</td>

    </tfoot>

    </table>

    </body>

    </html>


    Voilà si il y a des personnes suffisamment douées pour m'éclairer merci d'avance

    Cordialement

    Vous avez résolu votre problème avec VIC ? Faites-le savoir sur les réseaux sociaux !
    Vulgarisation-informatique.com
    Cours en informatique & tutoriels