Basemod.css

aus Papoo Dokumentation, der freien Wissensdatenbank
(Unterschied zwischen Versionen)
Wechseln zu: Navigation, Suche
 
 
(Eine dazwischenliegende Version von einem Benutzer wird nicht angezeigt)
Zeile 18: Zeile 18:
 
* '''#mod_menue_top''' Das Top Menü mit Hilfe | Impressum | Kontakt | etc.
 
* '''#mod_menue_top''' Das Top Menü mit Hilfe | Impressum | Kontakt | etc.
 
* '''#weiter''' Die weiter Links bei mehr als 20 Ergebnissen
 
* '''#weiter''' Die weiter Links bei mehr als 20 Ergebnissen
−
* #col1 {
+
* '''#col1''' Die linke Spalte, die Standardmäßig das Menü enthält
−
    width:220px;
+
* '''#mod_menue''' Der Menüblock bzw. Menü Modul komplett
−
    }
+
* '''.menuxaktiv''' Die normale Menüklasse
−
#mod_menue {
+
* '''.menuxaktiv_back''' Der aktive Menüpunkt
−
    width:220px;
+
* '''.menuy_aktiv''' Der Menüpunkt der oberen Ebene der aktiv ist, der einen aktiven Untermenüpunkt hat
−
    padding-top:50px;
+
* '''#mod_menue  .untermenu1''' Die Untermenü Klasse die Untermnüs der Ebene 1 enthält
−
    }
+
* '''#mod_menue  .untermenu2''' Die Untermenü Klasse die Untermnüs der Ebene 2 enthält
−
 
+
* '''#col2''' Die optische rechte Spalte
−
#mod_menue  ul li
+
* '''.rightitem''' Ein Eintrag in der rechten Spalte
−
{
+
* '''#col3''' Die mittlere Spalte
−
list-style-type: none;
+
* '''.comment_inhalt''' Inhalt der Kommentare
−
padding: 0px;
+
* '''.floatbox''' Die Box die jeweils einen Artikel oder Teaser enthält
−
margin: 0px;
+
* '''.messagedata h2, .messageh4''' Überschriften im Forum
−
 
+
* '''.artikelbox_left''' Box die Inhalte z.B. ein Bild links in den Float setzt, im Editor zu sehen
−
     
+
* '''.artikelbox_right''' Box die Inhalte z.B. ein Bild rechts in den Float setzt, im Editor zu sehen
−
}
+
* '''.teaserbildleft''' Bild links vom Teaser positionieren
−
 
+
* '''.bbeditor_element''' Ein Element im BBCode Editor
−
#mod_menue  .menuxaktiv, .menuxaktiv_back, .menuy_aktiv
+
* '''#formk, .form''' id eines Formulars
−
{
+
* '''#lightbox und folgende'''  Lightbox Überlagerung
−
display: block;
+
* '''#overlay und folgende'''
−
padding: 0px 5px 0px 10px;
+
* '''.breadcrump''' Brotkrumen Menü Modul
−
margin-top: 1px;
+
* '''#linkliste''' Linklisten Plugin
−
border-bottom:1px solid #fff;
+
−
border-top:1px dotted #AFB7B7;
+
−
     
+
−
}
+
−
#mod_menue  .untermenu1 {
+
−
    margin-left:20px;
+
−
margin-bottom:-10px;
+
−
    }
+
−
#mod_menue  .untermenu2 {
+
−
    margin-left:20px;
+
−
    }
+
−
#mod_menue  .untermenu1 a, #mod_menue  .untermenu1 span
+
−
{
+
−
padding: 0px 5px 0px 0px;
+
−
margin-top: 0px;
+
−
}
+
−
 
+
−
#mod_menue  .untermenu2 a, #mod_menue  .untermenu2 span
+
−
{
+
−
padding: 0px 5px 0px 50px;
+
−
margin-top: 0px;
+
−
}
+
−
 
+
−
#mod_menue .untermenu3 a, #mod_menue  .untermenu3 span
+
−
{
+
−
padding: 3px 5px 3px 70px;
+
−
margin-top: 0px;
+
−
}
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
/* ######################################################################################################
+
−
** ### spezielle Rechte Spalte                         ################################################
+
−
** ######################################################################################################
+
−
*/
+
−
 
+
−
#col2 {
+
−
    border:0px solid black;
+
−
    margin-top:20px;
+
−
    width: 180px;
+
−
    background:#F4F4E8;
+
−
    border-left:1px solid #fff;
+
−
    }
+
−
 
+
−
#col2 h1,
+
−
#col2 h2,
+
−
#col2 h3 {
+
−
    line-height:25px;
+
−
    padding-left:5px;
+
−
    height:25px;
+
−
    }
+
−
.loginh2 {
+
−
    display:none;
+
−
    }
+
−
.rightitem {
+
−
padding:10px;
+
−
font-size:90%;
+
−
}
+
−
/* ######################################################################################################
+
−
** ### spezielle Artikel-Klassen                        ################################################
+
−
** ######################################################################################################
+
−
*/
+
−
div {
+
−
    border:0px solid black;
+
−
    }
+
−
.sprachlink {
+
−
background:#fff;
+
−
border:1px solid #fff;
+
−
padding-top:10px;
+
−
margin:0px;
+
−
}
+
−
.sprachlink img {
+
−
margin:0px;
+
−
padding:0px;
+
−
border:0px;
+
−
}
+
−
#suchefor #search {
+
−
width:60%;
+
−
}
+
−
#sprechomat_start {
+
−
margin-top:15px;
+
−
float:right;
+
−
}
+
−
#col3 {
+
−
    background:#fff;
+
−
    margin-right:180px;
+
−
    margin-left:220px;
+
−
    padding-right:20px;
+
−
    padding-top:1em;
+
−
    padding-left:20px;
+
−
    text-align:left;
+
−
 
+
−
    }
+
−
#col3 p {
+
−
+
−
}
+
−
/* Darstellung der Kommentare */
+
−
.comment_inhalt {
+
−
background: #E2E2C8;
+
−
border: 1px solid #decab4;
+
−
color: inherit;
+
−
font-size: 90%;
+
−
padding: 10px;
+
−
width:90%;
+
−
margin:5px;
+
−
}
+
−
.floatbox {
+
−
padding-left:20px;
+
−
}
+
−
/* Um container innerhalb einer Artikels floaten, kann Bilder etc. enthalten */
+
−
.float_left_artikel {
+
−
background: #ffffff none;
+
−
border-bottom-width: 1px;
+
−
border-color: #5f603c;
+
−
border-right-width: 1px;
+
−
border-style: solid;
+
−
border-width: 1px;
+
−
color: inherit;
+
−
float: left;
+
−
font-size: 90%;
+
−
line-height: 120%;
+
−
margin: 10px;
+
−
padding: 10px;
+
−
position: relative;
+
−
}
+
−
.float_right_artikel {
+
−
background: #ffffff none;
+
−
border-bottom-width: 1px;
+
−
border-color: #5f603c;
+
−
border-right-width: 1px;
+
−
border-style: solid;
+
−
border-width: 1px;
+
−
color: inherit;
+
−
float: right;
+
−
font-size: 90%;
+
−
line-height: 120%;
+
−
margin: 10px;
+
−
padding: 10px;
+
−
position: relative;
+
−
}
+
−
/*
+
−
Foreneinträge
+
−
*/
+
−
 
+
−
.messagedata h2, .messageh4{
+
−
    background:#fff;
+
−
    padding:5px;
+
−
margin-right:20px;
+
−
margin-top:5px;
+
−
+
−
color:#1074B0;
+
−
    border:1px solid #1074B0;
+
−
position:relative;
+
−
 
+
−
    }
+
−
.messagedata, .forumboard {
+
−
   
+
−
    }
+
−
.messagedatap, .messagebot {
+
−
background:#E2E2C8;
+
−
    padding:10px;
+
−
margin-left:20px;
+
−
margin-top:-10px;
+
−
padding-top:20px;
+
−
 
+
−
+
−
    }
+
−
.messagefoot {
+
−
background:#E8E6DB;
+
−
margin-left:20px;
+
−
    padding:10px;
+
−
margin-top:-3px;
+
−
+
−
 
+
−
    }
+
−
.messageul li,
+
−
.messageul ul,
+
−
ul.messageul {
+
−
margin-left:7px;
+
−
}
+
−
ul.messageul, ul.messageul li {
+
−
+
−
}
+
−
.forumliste a{
+
−
    font-size:100%;
+
−
    font-weight:400;
+
−
    }
+
−
.hierforum {
+
−
background:#F8F182;
+
−
}
+
−
.artikelbox_left
+
−
{
+
−
overflow:hidden;
+
−
float: left;
+
−
width: 310px;
+
−
}
+
−
 
+
−
.artikelbox_right
+
−
{
+
−
overflow:hidden;
+
−
float: right;
+
−
width: 310px;
+
−
padding-left: 40px;
+
−
}
+
−
.teaserbildleft {
+
−
    margin:10px;
+
−
    margin-left:0px;
+
−
    }
+
−
/* ######################################################################################################
+
−
** ### Formulare allgemein                              ################################################
+
−
** ######################################################################################################
+
−
*/
+
−
input,
+
−
select,
+
−
textarea {
+
−
    border:1px solid black;
+
−
    }
+
−
input:focus,
+
−
select:focus,
+
−
textarea:focus {
+
−
    border:1px inset black;
+
−
    background:#eee;
+
−
    }
+
−
input[type=text], input[type=password], textarea
+
−
{
+
−
+
−
}
+
−
 
+
−
.bbeditor_element
+
−
{
+
−
float: left;
+
−
}
+
−
 
+
−
#formk, .form {
+
−
line-height: 140%;
+
−
}
+
−
#formk fieldset, .form fieldset {
+
−
background-color: #F1EFE2;
+
−
border: 1px solid #939A9D;
+
−
margin: 20px 0px 20px 0px;
+
−
        padding:10px;
+
−
}
+
−
#formk legend, .form legend {
+
−
background-color: #E2E2C8;
+
−
margin: 0px 0px 10px -20px;
+
−
padding: 2px 10px 2px 10px;
+
−
border: 1px solid #939A9D;
+
−
}
+
−
.forumlistex {
+
−
font-size:100%;
+
−
+
−
}
+
−
.forumlistex ul{
+
−
list-style-type:none;
+
−
}
+
−
.floatbox {
+
−
   
+
−
    }
+
−
 
+
−
/* für IE */
+
−
.innerform {
+
−
}
+
−
.form label {
+
−
}
+
−
/* .form input[type=text] */
+
−
#formk .inpt, .form .inpt {
+
−
margin-left: 1em;
+
−
text-align: left;
+
−
width: 70%;
+
−
        margin-bottom:5px;
+
−
}
+
−
/* Textarea */
+
−
#formk .txt, .form .txt {
+
−
margin-left: 1em;
+
−
text-align: left;
+
−
width: 70%;
+
−
}
+
−
input.inpt:focus, textarea.txt:focus {
+
−
background: #eee;
+
−
}
+
−
#formk select , .form select {
+
−
margin-left: 1em;
+
−
text-align: left;
+
−
+
−
}
+
−
.headerfor {
+
−
background:#DAD9DF;
+
−
padding:5px;
+
−
}
+
−
/* Label von Checkboxen */
+
−
.label {
+
−
border-bottom: 1px dotted #000;
+
−
}
+
−
/* input[type=submit] */
+
−
#formk .senden, .form .senden {
+
−
margin: 0px 0px 0px 55%;
+
−
}
+
−
label, .label, select, input[type=checkbox], input[type=radio], input[type=submit], .senden {
+
−
cursor: pointer;
+
−
}
+
−
label, .label, select, .inpt, .txt {
+
−
margin-bottom: 20px;
+
−
}
+
−
.senden {
+
−
margin-bottom: 0px;
+
−
}
+
−
#formk p, .form p {
+
−
margin: 20px 0px 10px 0px;
+
−
}
+
−
#formk textarea, .form textarea {
+
−
    width:90%;
+
−
    }
+
−
 
+
−
legend {
+
−
padding: 2px 2px 2px 2px;
+
−
}
+
−
label {
+
−
        margin-bottom: 2em;
+
−
}
+
−
.formwrap {
+
−
background-color: transparent;
+
−
margin: 20px 0px 20px 0px;
+
−
        width:90%;
+
−
 
+
−
}
+
−
.formwrap_guest {
+
−
background-color: transparent;
+
−
margin: 20px 0px 20px 0px;
+
−
        width:90%;
+
−
}
+
−
#footer {
+
−
    border-top:1px solid #B2AB84;
+
−
    background:#fff;
+
−
    }
+
−
#lightbox{
+
−
background-color:#eee;
+
−
padding: 10px;
+
−
border-bottom: 2px solid #666;
+
−
border-right: 2px solid #666;
+
−
}
+
−
#lightboxDetails{
+
−
font-size: 0.8em;
+
−
padding-top: 0.4em;
+
−
}
+
−
#lightboxCaption{ float: left; }
+
−
#keyboardMsg{ float: right; }
+
−
#closeButton{ top: 5px; right: 5px; }
+
−
 
+
−
#lightbox img{ border: none; clear: both;}
+
−
#overlay img{ border: none; }
+
−
 
+
−
#overlay{ position:absolute;
+
−
margin-top:-20px;
+
−
background-image: url(../../bilder/overlay.png); }
+
−
 
+
−
.tab1 {
+
−
width:100%;
+
−
}
+
−
/* #################Doku###########################*/
+
−
.breadcrump {
+
−
background:#eee;
+
−
margin-bottom:20px;
+
−
+
−
}
+
−
div.tright {
+
−
   
+
−
    float: right;
+
−
    border-width: .5em 0 .8em 1.4em;
+
−
}
+
−
div.tleft {
+
−
    float: left;
+
−
    margin-right: .5em;
+
−
    border-width: .5em 1.4em .8em 0;
+
−
}
+
−
#linkliste {
+
−
margin-left:10px;
+
−
 
+
−
}
+
−
.linklistul, .linklistul li, .pdatlist {
+
−
list-style-type:none;
+
−
margin:0px;
+
−
pading:0px;
+
−
}
+
−
 
+
−
.linkitem  {
+
−
border-bottom:1px solid #ddd;
+
−
width:100%;
+
−
height:160px;
+
−
}
+
−
.decrip {
+
−
color:#444;
+
−
 
+
−
}
+
−
.linkitem h2 {
+
−
border:none;
+
−
}
+
−
.linkbilditem {
+
−
float:left;
+
−
margin-right:20px;
+
−
margin-bottom:10px;
+
−
}
+
−
.linklist_inhalt {
+
−
 
+
−
}
+
−
.p_logo {
+
−
float:right;
+
−
 
+
−
}
+
−
.pdaten {
+
−
border-bottom:1px solid #ddd;
+
−
width:100%;
+
−
height:140px;
+
−
}
+

Aktuelle Version vom 28. August 2006, 22:31 Uhr

Sie sind hier: Hauptseite / Papoo CSS Layout / CSS Grundgerüst / basemod.css

basemod.css

Die basemod.css beinhaltet alle Anpassungen des Layouts an das Standardlayout mit allen Blöcken.

  • #head Der Kopf der oben angezeigt wird und das Hintergrundbild mit der Straße beinhaltet.
  • #page_margins Festlegung der Layoutbreite und Zentrierung
  • #mod_suchbox Die Suchbox
  • #mod_styleswitcher Die Box mit dem Styleswitcher
  • #mod_login Die Einlogg Box
  • #main beinhaltet die col1, col2 und col3
  • #footer das ist der optische Fuß
  • #mod_kopftext Das Modul mit dem Kopftext, z.B. Dies ist die Überschrift ganz oben auf Ihrer neuen Seite.
  • #mod_kopftext h1, .toph1 beschreibt die Überschrift innerhalb des Moduls Kopftext
  • #mod_kopftext a der Link innerhalb des Moduls Kopftext
  • #menue_sprung, .breadtext, .ignore, .ignoreornot, dfn Unsichtbare Objekte
  • #mod_efa_fontsize Die Schrfitgrößen änder -> A+ A A-
  • #mod_sprachwahl Die Sprachauswahl
  • #mod_menue_top Das Top Menü mit Hilfe | Impressum | Kontakt | etc.
  • #weiter Die weiter Links bei mehr als 20 Ergebnissen
  • #col1 Die linke Spalte, die Standardmäßig das Menü enthält
  • #mod_menue Der Menüblock bzw. Menü Modul komplett
  • .menuxaktiv Die normale Menüklasse
  • .menuxaktiv_back Der aktive Menüpunkt
  • .menuy_aktiv Der Menüpunkt der oberen Ebene der aktiv ist, der einen aktiven Untermenüpunkt hat
  • #mod_menue .untermenu1 Die Untermenü Klasse die Untermnüs der Ebene 1 enthält
  • #mod_menue .untermenu2 Die Untermenü Klasse die Untermnüs der Ebene 2 enthält
  • #col2 Die optische rechte Spalte
  • .rightitem Ein Eintrag in der rechten Spalte
  • #col3 Die mittlere Spalte
  • .comment_inhalt Inhalt der Kommentare
  • .floatbox Die Box die jeweils einen Artikel oder Teaser enthält
  • .messagedata h2, .messageh4 Überschriften im Forum
  • .artikelbox_left Box die Inhalte z.B. ein Bild links in den Float setzt, im Editor zu sehen
  • .artikelbox_right Box die Inhalte z.B. ein Bild rechts in den Float setzt, im Editor zu sehen
  • .teaserbildleft Bild links vom Teaser positionieren
  • .bbeditor_element Ein Element im BBCode Editor
  • #formk, .form id eines Formulars
  • #lightbox und folgende Lightbox Überlagerung
  • #overlay und folgende
  • .breadcrump Brotkrumen Menü Modul
  • #linkliste Linklisten Plugin
Von "http://www.doku.papoo.de/index.php?title=Basemod.css&oldid=2613"
'Persönliche Werkzeuge
Namensräume
Varianten
Aktionen
Navigation
Werkzeuge