1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
@charset "utf-8";

/**
 * Body-Definitionen
 */

body {
    color: #C0C0C0;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    line-height: 1.2em;
    text-align: justify;
    font: x-small/1.2em Verdana, Arial, Helvetica, sans-serif;
    voice-family: ""}""; voice-family:inherit;
    font-size: small;
    background-color: #1d1a14;
    background-image: url(../images/hintergrund.jpg);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: top center;
}

/**
 * Formulare
 */

input,
textarea,
select,
select option {
    background-color: #1d1a14;
    background-image: url(../images/hintergund.jpg);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: top center;
    color: #C0C0C0;
}

Damit gibt man den Elementen <input>, <textarea>, <select> und <option> den selben Hintergrund wie auch <body>.

Ausgerichtet wird der Hintergrund mittels background-position: top center; ausgerichtet und durch background-attachment: fixed; am Mitscrollen gehindert. Dadurch entsteht der Eindruck, als hätten Eingabeelemente keinen eigenen Hintergrund.

Dies macht natürlich nur Sinn, wenn um diese Elemente auch eine Art Abgrenzung durch einen Rahmen oder Ähnliches ist.

Artikel / Seite weiterempfehlen

Schreibe einen Kommentar

Ihre Email-Adresse wird nicht veröffentlicht. Pflichtfelder sind durch * markiert.

Sie können folgende HTML-Tags benutzen: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>