Als erstes erstellt man ein halb transperentes Bild, geeignetes Format hierfür wäre PNG. Nun erstellen wir eine DIV Box die wie Folgt aussieht:

<DIV id=”Wasserzeichen”></div>

Der Csscode hierfür schaut dann so aus:

#Wasserzeichen{
bottom: 10px;
right: 10px;
position: fixed;}

“fixed” ist das geheimwort, welches das Bild beim scrollen unterbindet, dasses mit scrollt. Dadurch schaut es wie ein Wasserzeichen aus.

Ich perönlich mag kein Javascript und zeige hier mehrere Möglichkeiten wie man eine Browserweiche auch ohne Javascript erreicht.

Browserweiche via SSI

Server Side Include is eine Serverseitige Skriptsprache, die diverse Umgebungsvariablen des Webservers zu verfügung hat. Anhand dieser Umgebungsvariablen kann man zum beispiel mit $HTTP_USER_AGENT erfahren welchen Browser der User hat. Wie bei den meistern Skriptsprachen kann men IF Bedingungen erstellen. Eine simple IF, ELSE IF und ELSE könnte wie folgt aussehe:

<!–#if expr=”$HTTP_USER_AGENT = /MSIE/” –>
<link rel=”stylesheet” type=”text/css” href=”/css/layout_ie.css”>
<!–#elif expr=”$HTTP_USER_AGENT = /Mozilla/” –>
<link rel=”stylesheet” type=”text/css” href=”/css/layout_ns.css”>
<!–#else –>
<link rel=”stylesheet” type=”text/css” href=”/css/layout.css”>
<!–#endif –>

Browserweiche vom Internet Explorer

Der Internet Explorer hat eine eingebaute Browserweiche, die mach sich nutzen machen kann.

<!–[if IE 6]>
<style type=”text/css”>@import url(layout_IE.css);</style>
<![endif]–>

Optionen:

[if IE] [if IE 6] [if IE 7] [if IE 5.5]

! – nicht
lt – Kleiner als
lte – Kleiner gleich
gt – Gösser als
gte – Grösser gleich

Als Beispiel wollen wir alle Internet Explorer aber der Version 6 ein spezielles CSS File geben.

<!–[if gte IE 6]>
<style type=”text/css”>@import url(layout_IE+.css);</style>
<![endif]–>

Referenzen

css4you selfhtml devmag