Design/Style ohne Tabellen

[Thomas P]

Hallo,

hat sich schon mal jemand an ein vB3 Style ohne Tabellen gewagt?

Also rein mit CSS?

thx,
-Tom

[Thomas P]

Hier ein paar Beispiele:

http://www.csszengarden.com/

http://www.webstandards.org/

http://www.zeldman.com/dwws/

[h75]

Würde mich auch interessieren.. Wie geht das? Das man statt Tabellen CSS verwendet? Poste mal ein Beispeil, wenn du eins hast?

Diese Tabelle - wie müsste die in CSS aussehen? :confused:

<table class="tborder" cellpadding="0" cellspacing="0" border="2"
width="$stylevar[outerdivwidth]" align="center"><tr>
<td width="33%" class="foothead"><div align="left">
Linker Inhalt
</div></td>
<td width="34%" class="foothead"><div align="center">
Mittlerer Inhalt
</div></td>
<td width="33%" class="foothead"><div align="right">
Rechter Inhalt
</div></td>
</tr></table>

[Thomas P]

Beispiele siehe obige Seiten im Quellcode

[m-e-h.com]

Das ist eine etwas knifflige Sache, aber dafür sieht es auch super aus, wenn man den Kniff einmal raus hat - in allen Auflösungen.

Ich hab mit CSS-Positionierung das letzte mal vor ca. 2 Jahren gearbeitet, von daher bin ich da nicht mehr so fit.

Das wird aber alles mit Positionsangaben (75% oben und 30% rechts) und Abständen (200px von unten und 563 von links) positioniert.

cm

[2580]

Im quell test nachschauen und
<script language="JavaScript" type="text/javascript" src="/j/nuj.js"></script>

suchen.
Dann den Pfad entsprechend ergänzen und file Saugen.

ausschnitt aus der datei von dwws


// toggle visibility
function toggle( targetId ){
if (document.getElementById){
target = document.getElementById( targetId );
if (target.style.display == "none"){
target.style.display = "";
} else {
target.style.display = "none";
}
}
}

// swap images

function newImage(arg) {
if (document.images) {
rslt = new Image();
rslt.src = arg;
return rslt;
}
}
function changeImages() {
if (document.images && (preloadFlag == true)) {
for (var i=0; i<changeImages.arguments.length; i+=2) {
document[changeImages.arguments[i]].src = changeImages.arguments[i+1];
}
}
}
var preloadFlag = false;
function preloadImages() {
if (document.images) {
logoover = newImage("/i/nulay/logohomeo.gif");
comingover = newImage("/i/nulay/glareon.gif");
preloadFlag = true;
}
}
// switch styles
function setActiveStyleSheet(title) {
var i, a, main;
for (i=0; (a = document.getElementsByTagName("link")[i]); i++) {
if (a.getAttribute("rel") &&
a.getAttribute("rel").indexOf("style") != -1 &&
a.getAttribute("title")) {
a.disabled = true;
if(a.getAttribute("title") == title) a.disabled = false;
}
}
}
function getActiveStyleSheet() {
var i, a;
for (i=0; (a = document.getElementsByTagName("link")[i]); i++) {
if (a.getAttribute("rel") &&
a.getAttribute("rel").indexOf("style") != -1 &&
a.getAttribute("title") &&
!a.disabled
) return a.getAttribute("title");
}
return null;
}
function getPreferredStyleSheet() {
var i, a;
for (i=0; (a = document.getElementsByTagName("link")[i]); i++) {
if (a.getAttribute("rel") &&
a.getAttribute("rel").indexOf("style") != -1 &&
a.getAttribute("rel").indexOf("alt") == -1 &&
a.getAttribute("title")
) return a.getAttribute("title");
}
return null;
}
function createCookie(name,value,days) {
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
}
else expires = "";
document.cookie = name+"="+value+expires+"; path=/";
}
function readCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}
window.onload = function(e) {
var cookie = readCookie("style");
var title = cookie ? cookie : getPreferredStyleSheet();
setActiveStyleSheet(title);
}
window.onunload = function(e) {
var title = getActiveStyleSheet();
createCookie("style", title, 365);
}
var cookie = readCookie("style");
var title = cookie ? cookie : getPreferredStyleSheet();
setActiveStyleSheet(title);


Blick da kaum durch weil ich keine Ahnung habe.
vieleicht hilft es ja den einen oder anderen.

gruß

[Thomas P]

Äherm - es geht mir hier nicht um "wie geht das", sondern rein um das Interesse wer schon einen CSS Style nutzt oder ob es bald so einen Style geben wird.

Es geht auch ohne "Klau" ... ;)

[2580]

Klauen ist es wenn du es so Übernimmst
Sich anschauen udn draus lernen ist was was ganz anderes als klauen.

[h75]

Ja aber das muss doch net so sein. Da fange ich jetzt schon an, zu überlegen, wie ich meinen Quelltext sicherer bekomme, so das man da net mehr einfach "kucken" kann.. Echt, da sitzt man stundenlang und baut und dann kommt einer, der es nachmacht. Gut, das kann man schon mal machen, um was zu lernen, aber dannh sollte man das net so öffentlich "aufschreiben"...

WIE GUT DAS MAN "PHP" NET KLAUEN KANN! ;)

[Thomas P]

Keine Panik - sollte kein Vorwurf sein, sorry wenn das so 'rüberkam.

Wie gesagt geht es mir mehr um den Infoaustausch: Wer hat schon, wer will nochmal ;)

[Christian]

Ja aber das muss doch net so sein. Da fange ich jetzt schon an, zu überlegen, wie ich meinen Quelltext sicherer bekomme, so das man da net mehr einfach "kucken" kann.. Echt, da sitzt man stundenlang und baut und dann kommt einer, der es nachmacht. Gut, das kann man schon mal machen, um was zu lernen, aber dannh sollte man das net so öffentlich "aufschreiben"...

WIE GUT DAS MAN "PHP" NET KLAUEN KANN! ;)

Mach das:

<body oncontextmenu="return false">

Unterbindet den Rechsklick.
Ist aber kein wirklicher Schutz.

[h75]

Der Validator meckert aber, wenn man das verwendet. Nur mal so zur Info ;)