Box erstellen?

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • Moin,
    Wenn du auch ein WBB Forum hast, kannst du dir das Plugin im Pluginstore von Woltlab runterladen (Ich denke mal, dass es da vertreten sein wird),
    wenn du eine selbsterstellte Seite ahst, an sich einfach eine Div-Box, die du mit CSS bisschen schön ausschmückst.
    Zum Beispiel:

    HTML-Quellcode

    1. <div class='InfoBox'>Hier der Inhalt der Infobox</div>


    das formatierst du nun bisschen mit CSS.
    also z.B.

    CSS-Quellcode

    1. div.InfoBox{
    2. background-color: lightblue;
    3. background-image: url('Info.png');
    4. background-repeat: no-repeat;
    5. background-position: right;
    6. border-style: solid;
    7. color: blue;
    8. height: 25px;
    9. width: 100%;
    10. }


    Jetzt mal als Beispiel,
    hab da nun iwelche Maße hingeschrieben und einen Bildnamen ausgedacht.
    Das musst du dir so einfach zurechtmachen.
    Was bei meinem Beispiel übrigens genau rauskommt wird nicht sonderlich wunderschön sein, wie gesgat mal eben als Beispiel was hingeschrieben.
    Gruß,
    Dennis
  • Farbe der Box.

    CSS-Quellcode

    1. background-color:#HEX;


    bzw. wenn der Boxhintergund ein Bild sein soll, dann:

    CSS-Quellcode

    1. background-image:url('link');
    2. background-repeat:no-repeat; /* oder repeat, repeat-x, repeat-y */
    3. background-position:left; /*top, bottom, right, left, ...*/


    Das ganze komprimiert auf eine Zeile:

    CSS-Quellcode

    1. background:#color url('image') repeat position;


    ---------------
    Eine Grafik die du mit Photoshop erstellt hast musst du mit HTML, CSS umsetzen, wie man das anfängt hat dir Dennis ja gezeigt. :)

    Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von Steffi ()