• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Html Tabelle??

Werbung:
HTML ist nur für das Auszeichnen des Inhaltes zuständig, nicht für irgendwelche Darstellungen...

Ist dein Mühle-Brett so mit einer Tabelle richtig ausgezeichnet, sprich hast du tabellarische Daten?

Ich denke das ist eher der falsche Weg den du gehst..am besten wäre es wenn du ersteinmal eine Grafik erstellst und dann anschließend Listenpunkte frei positionierst auf den Feld...so könnte ich e smir zumindest vorstellen.


Gruß
Loon3y
 
Ein Mühle-/Schachbrett besteht aus 64 Feldern.
Das lässt sich mit einer Tabelle mit 8 Zeilen lösen, wobei jede Zeile wiederum 8 Zellen hat.
Je Zeile wird die Reihenfolge der Zellfarben per CSS-Klasse gewechselt.
Hier mal ein Beispiel für die ersten beiden Zeilen, einfach die beiden Zeilen noch dreimal kopieren und einfügen.
Rahmen kannst du noch entsprechend zuweisen, halte ich aber nicht für erforderlich.
CSS:
Code: 
table {
border: 1px solid #ccc;
}

.black  {
width: 80px;
height: 80px;
background: #000;
}

.white  {
width: 80px;
height: 80px;
background: #fff;
}
HTML:

Code: 
<table>

<tr>
<td class="black">
</td>
<td class="white">
</td>
<td class="black">
</td>
<td class="white">
</td>
<td class="black">
</td>
<td class="white">
</td>
<td class="black">
</td>
<td class="white">
</td>
</tr>

<tr>
<td class="white">
</td>
<td class="black">
</td>
<td class="white">
</td>
<td class="black">
</td>
<td class="white">
</td>
<td class="black">
</td>
<td class="white">
<td class="black">
</td>
</td>
</tr>

</table>
 
Werbung:
prm schrieb:
Ein Mühle-/Schachbrett besteht aus 64 Feldern.
Zum Vergrößern anklicken....

Du verwechselst Mühle mit Dame...

Loon3y schrieb:
HTML ist nur für das Auszeichnen des Inhaltes zuständig, nicht für irgendwelche Darstellungen...
Zum Vergrößern anklicken....

Das ist zwar richtig - trotzdem könnte es sein, dass der Lehrer glaubt, eine
derart unsinnige Aufgabe stellen zu müssen...

Loon3y schrieb:
Ich denke das ist eher der falsche Weg den du gehst..am besten wäre es wenn du ersteinmal eine Grafik erstellst und dann anschließend Listenpunkte frei positionierst auf den Feld...so könnte ich e smir zumindest vorstellen.
Zum Vergrößern anklicken....

M.E. sind da Listenpunkte auch nicht richtig, da es keine Liste gibt.

Grüße
Bernhard
 
Werbung:
King54 schrieb:
es darf weder ein bild sien noch das es was anderes sein ausser HTML
Zum Vergrößern anklicken....
Darf man fragen, was der Unfug werden soll?
Das ist nicht die Anwendung von HTML. Das ist, als würde Dir jemand sagen, Du sollst ein Schnitzel braten, darfst dazu aber nur Stift und Papier (und ne Herdplatte) verwenden. Soll das Schnitzel dann aufs Papier auf die Herdplatte und wird mit dem Stift gewendet?

HTML ist nicht dazu da, irgendeine Ausgabe zu erzeugen. Dazu gibts CSS. Und ein Mühle-Brett mit CSS malen würd ich auch nicht machen wollen und mit HTML, selbst mit Tabellen, wüsste ich gar nicht, ob das geht...mit HTML gehts wahrscheinlich nur, wenn Du mehrere Elemente überlagerst, und wenn Du auch kein CSS benutzen darfst, dann wird das Vorhaben wohl vollständig scheitern.

Ich sehe keinen Sinn in der Aufgabe. HTML lernt man damit jedenfalls nicht.
 
Werbung:
Ich kann Dir leider auch nicht weiterhelfen. Aber vielleicht hat er ja, ähnlich wie prm, auch dame und mühle verwechselt Nur halt umgekehrt ;-)

Gruß thuemmy
 
So, zunächst mal sorry, dass ich Mühle mit Dame verwechselt habe.
Dame wäre aber mit Tabellen wirklich leichter gewesen. :)

Ansonsten bin ich mit Tabellen nicht so fit, dass ich ein Mühlebrett erstellen könnte, es sollte aber nicht unmöglich sein.

Was ich mir vorstellen kann, wäre ein Mühlebrett ohne Tabellen, nämlich mit absolut positionierten Div's.
Falls daran Interesse besteht, würde ich mich rein aus Spaß mal dranmachen.

Das sind eben reine Spielereien.
 
Werbung:
Hier meine Variante: Eine mit CSS formatierte Tabelle (bzw. 3 Tabellen):

HTML:
Code: 
<table cellspacing="0" class="table1">

<tr>
<td class="td1">&nbsp;
</td>
<td class="td1">&nbsp;
</td>
</tr>
<tr>
<td class="td1">&nbsp;
</td>
<td class="td1">&nbsp;
</td>
</tr>
</table>

<table class="table2">
<tr>
<td class="td2">&nbsp;
</td>
<td class="td2">&nbsp;
</td>
</tr>
<tr>
<td class="td2">&nbsp;
</td>
<td class="td2">&nbsp;
</td>
</tr>
</table>


<table class="table3">
<tr>
<td class="td3">&nbsp;
</td>
</tr>
</table>

CSS:
Code: 
.table1 {
border: 1px solid #000;
position: relative;
}

.table2 {
border: 4px solid #000;
position: absolute;
top: 158px;
left: 158px;
}

.table3 {
border: 4px solid #000;
position: absolute;
top: 277px;
left: 273px;
}

.td1  {
border: 2px solid #000;
width: 300px;
height: 300px;
}

.td2  {
width: 150px;
height: 150px;
}

.td3  {
width: 75px;
height: 75px;
}
 
Werbung:
Schreibe das innerhalb des head-Bereichs der HTML-Seite, z.B. unmittelbar vor </head>

Code: 
<style type="text/css">
.table1 {
border: 1px solid #000;
position: relative;
}

.table2 {
border: 4px solid #000;
position: absolute;
top: 158px;
left: 158px;
}

.table3 {
border: 4px solid #000;
position: absolute;
top: 277px;
left: 273px;
}

.td1  {
border: 2px solid #000;
width: 300px;
height: 300px;
}

.td2  {
width: 150px;
height: 150px;
}

.td3  {
width: 75px;
height: 75px;
}

</style>

Den HTML-code füge innerhalb body ein.
 
kurz zur Erläuterung:
Es handelt sich um 3 Tabellen, die so zueinander positioniert sind, dass sie sich teilweise überlappen und so das "Mühlenmuster" zustande kommt.

Aber ich vermute, das wird dein chef auch nicht verstehen :mrgreen:

Dein eigener Ansatz sieht ja schon gut aus. Jetzt müsstest du nur noch versuchen, die Rahmenstärken so zu definieren, dass zum Schluss eine einheitliche Breite rauskommt.
Bei den einzelnen Zellenrahmen vielleicht auch mit border-left/border-right usw. arbeiten.
Die Rahmen, die aneinandergrenzen müssen eben dünner sein, als die freistehenden.
 
Werbung:
Mit Style-Angaben kannst du jede Seite einer Zelle ansprechen.
Z.B.
Code: 
<td style="border-left: 1px solid red; border-right: 2px solid green; border-top: 3px solid  yellow; border-bottom: 4px solid blue;">zellinhalt</td>
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben