Ci-dessous, les différences entre deux révisions de la page.
Prochaine révision | Révision précédente | ||
mozilla:firefox:bookmarkshome [d/m/Y H:i] sylvain créée |
mozilla:firefox:bookmarkshome [d/m/Y H:i] sylvain |
||
---|---|---|---|
Ligne 1: | Ligne 1: | ||
- | ===== Version 2.1 ===== | ||
- | ''body { | ||
- | font-family: Verdana, Arial, Helvetica, sans-serif; | ||
- | background-color:#AABBCE; | ||
- | margin:10px; | ||
- | padding:0; | ||
- | font-size:12px; | ||
- | color:#223953; | ||
- | } | ||
- | a { | ||
- | text-decoration:none; | ||
- | } | ||
- | |||
- | /**************************************** | ||
- | form#searchForm | ||
- | formulaire de recherche | ||
- | haut de page | ||
- | ****************************************/ | ||
- | form#searchForm { | ||
- | position:relative; | ||
- | margin:10px auto; | ||
- | width:80%; | ||
- | text-align:center; | ||
- | } | ||
- | |||
- | form#searchForm img { | ||
- | vertical-align:middle; | ||
- | } | ||
- | |||
- | /* Sélection déroulante */ | ||
- | form#searchForm select { | ||
- | padding:1px; | ||
- | border:1px solid #223953; | ||
- | -moz-border-radius:5px; | ||
- | background-color:#BFCDDE; | ||
- | font-weight:bold; | ||
- | } | ||
- | |||
- | form#searchForm select option { | ||
- | border-bottom:1px solid #D7E1EC; | ||
- | background-color:#BFCDDE; | ||
- | font-weight:bold; | ||
- | } | ||
- | |||
- | /* champ texte */ | ||
- | form#searchForm input[type="text"] { | ||
- | padding:2px; | ||
- | width:60%; | ||
- | border:1px solid #223953; | ||
- | -moz-border-radius:5px; | ||
- | background-color:#BFCDDE; | ||
- | font-weight:bold; | ||
- | } | ||
- | |||
- | form#searchForm input:focus[type="text"] { | ||
- | background-color:#D7E1EC; | ||
- | } | ||
- | |||
- | /* bouton */ | ||
- | form#searchForm input[type="submit"] { | ||
- | padding:1px; | ||
- | border:1px solid #223953; | ||
- | -moz-border-radius:5px; | ||
- | background-color:#527193; | ||
- | color:#ffffff; | ||
- | } | ||
- | |||
- | form#searchForm input:hover[type="submit"] { | ||
- | background-color:#FFDE00; | ||
- | color:#223953; | ||
- | } | ||
- | |||
- | /**************************************** | ||
- | table#bookmarksSheet | ||
- | affichage du contenu en colonnes | ||
- | ****************************************/ | ||
- | table#bookmarksSheet { | ||
- | position:relative; | ||
- | width:80%; | ||
- | margin:10px auto; | ||
- | border-collapse:separate; | ||
- | border-spacing:10px; | ||
- | table-layout: fixed; | ||
- | } | ||
- | |||
- | table#bookmarksSheet td { | ||
- | position:relative; | ||
- | empty-cells: show; | ||
- | vertical-align:top; | ||
- | } | ||
- | |||
- | /**************************************** | ||
- | div.folder | ||
- | dossiers | ||
- | ****************************************/ | ||
- | div.folder { | ||
- | position:relative; | ||
- | margin:0 0 5px 0; | ||
- | padding:5px; | ||
- | background-color:#527193; | ||
- | -moz-border-radius:10px; | ||
- | } | ||
- | |||
- | div.folder:hover { | ||
- | background-color:#6885A4; | ||
- | } | ||
- | |||
- | /**************************************** | ||
- | div.folder h1 | ||
- | titre des dossiers | ||
- | ****************************************/ | ||
- | div.folder h1 { | ||
- | position:relative; | ||
- | margin:0; | ||
- | padding:0; | ||
- | z-index:1; | ||
- | text-align:center; | ||
- | } | ||
- | |||
- | div.folder h1 a { | ||
- | position:relative; | ||
- | display:block; | ||
- | padding:5px; | ||
- | font-size:14px; | ||
- | color:#ffffff; | ||
- | color:#ffffff; | ||
- | } | ||
- | |||
- | div.folder h1 a span { | ||
- | position:relative; | ||
- | display:block; | ||
- | letter-spacing:2px; | ||
- | } | ||
- | |||
- | div.folder h1 a span + span { | ||
- | font-size:12px; | ||
- | font-style:italic; | ||
- | font-weight:normal; | ||
- | letter-spacing:normal; | ||
- | } | ||
- | |||
- | /**************************************** | ||
- | div.folder | ||
- | contenu de chaque dossier | ||
- | ****************************************/ | ||
- | div.folder ul { | ||
- | position:absolute; | ||
- | display:none; | ||
- | left:20%; | ||
- | width:90%; | ||
- | margin:-2% 0 0; | ||
- | padding:5px; | ||
- | background-color:#BFCDDE; | ||
- | -moz-border-radius:10px; | ||
- | z-index:10; | ||
- | list-style:none; | ||
- | } | ||
- | |||
- | div.folder:hover ul { | ||
- | display:block; | ||
- | } | ||
- | |||
- | div.folder ul li { | ||
- | margin:0; | ||
- | padding:12px 0; | ||
- | } | ||
- | |||
- | div.folder ul li a { | ||
- | position:absolute; | ||
- | display:block; | ||
- | width:100%; | ||
- | margin:-10px 0 0; | ||
- | padding:2px; | ||
- | font-size:12px; | ||
- | font-weight:bold; | ||
- | color:#000000; | ||
- | z-index:10; | ||
- | } | ||
- | |||
- | div.folder ul li a:hover { | ||
- | width:105%; | ||
- | margin:-12px 0 0 -5%; | ||
- | padding:5px; | ||
- | background-color:#FFC600; | ||
- | border:1px solid #223953; | ||
- | -moz-border-radius:10px; | ||
- | font-size:14px; | ||
- | z-index:11; | ||
- | } | ||
- | |||
- | div.folder ul li a img { | ||
- | margin:0 4px 0 0; | ||
- | height:16px; | ||
- | border:none; | ||
- | vertical-align:middle; | ||
- | } | ||
- | |||
- | div.folder ul li a:hover img { | ||
- | height:20px; | ||
- | } | ||
- | |||
- | div.folder ul li.separator { | ||
- | border-bottom:1px solid #D7E1EC; | ||
- | padding:0; | ||
- | margin:5px 0; | ||
- | } | ||
- | |||
- | /**************************************** | ||
- | div.hoverDiv | ||
- | description des contenus | ||
- | élément flotant | ||
- | ****************************************/ | ||
- | .hoverDiv { | ||
- | display:none; | ||
- | position:relative; | ||
- | margin:0; | ||
- | padding:0; | ||
- | background-color:#D0D4DA; | ||
- | font-size:10px; | ||
- | } | ||
- | |||
- | .hoverDiv h1 { | ||
- | position:relative; | ||
- | margin:0; | ||
- | padding:0; | ||
- | font-size:10px; | ||
- | background-color:#7595B9; | ||
- | } | ||
- | |||
- | .hoverDiv span { | ||
- | position:relative; | ||
- | font-size:10px; | ||
- | } | ||
- | |||
- | /**************************************** | ||
- | #otherLinks | ||
- | Liens du bas | ||
- | ****************************************/ | ||
- | #otherLinks { | ||
- | position:relative; | ||
- | margin:10px auto; | ||
- | width:80%; | ||
- | text-align:center; | ||
- | } | ||
- | |||
- | #otherLinks * li { | ||
- | display:inline; | ||
- | padding-right: 3em; | ||
- | } | ||
- | |||
- | #otherLinks * a { | ||
- | color:#223953; | ||
- | font-weight:bold; | ||
- | } | ||
- | %%'' |