Hallo Bandit,
also quasi meine Lösung mit divs ist ja scheinbar richtig! Nur eben ohne den php-teil, denn das kommt erst später, das wir php machen! Javascript wird das nächste sein was wir noch machen in diesem Zusammenhang mit der Aufgabe!
Trotzdem Danke. Mit php wird das enorm kürzer, obwohl, wenn der Server das an den Client schickt, ja quasi das gleiche rauskommt wie ich es jetzt von Hand gebastelt hab!
Nochmals Danke Bandit!
Hallo Bandit
So, ich hab weiter versucht!
Bis jetzt hjab ich es jetzt geschafft, das ich bei Verwendung von Einzelbikdern das mit divs ohne id hinbekomme, Das heisst,
ich lege divs innerhalb des divs spielfeld an, weise diesen abwechselnd die Klasse sprite-1 bzw. 2 zu. In CSS setze ich jetzt auf Einzelbilder.
ich lege einen Selektor div.sprite-1 bzw div.sprite-2 an und weise diesen dann das jeweilige Hintergrundbild, eine Höhe und Breite von 50 und ein Float:Left zu.
Dann geht das. Die Frage ist nur, ob das die Lösung sein soll? Zig divs um nen Hintergrund zu kacheln und zweitens, mit der css-Spritegrafik das bekomm ich nicht hin,
was muss ich denn der Klasse dann für werte bei background-position und background-repeat mitgeben?
Hallo Bandit,
sozusagen. Ich hab nen Kurs für Webentwicklung am laufen. Ich komme ja soweit ganz gut klar. Aber diese Aufgabe raubt mir den Verstand.
Ich hatte schon nachgedacht, ob ich das ganze an li 's hänge oder an andere divs innerhalb des divs spielfeld und diese dann float:left setze. Aber kann ich nen div ohne id verwenden und ihr einfach die klasse .sprite-1 bzw sprite-2 zuordnen?
das wären ja dann zig divs! Das muss doch einfacher gehen!
Wenn du es weisst, dann gib mir zumindest nen kleinen Schubser in die richtige Richtung = Tip!
Vielen Dank im Voraus
Gruss Joo
Hallo Azr,
div ist ein Blockelement, während ul ein Inline-Element darstellt. Inline elemente dürfen gem. HTM keine Blockelemente enthalten, es geht nur Block-Block oder Block-Inline.
Ich hoffe dir geholfen zu haben!
Gruss Joo
Hallo Leutz,
ich habe folgende Aufgabe zu bewältigen und komme nicht klar , ich bitte dringend um Hilfe!
Ich habe eine Grafikdatei (siehe Anlage) namens bg-sprites. In dieswer Datei sind 2 Einzelgrafiken mit einer Breite von 50 Pixeln und einer Höhe von 50 Pixeln enthalten.
Des weiteren existiert eine html-datei, namens index.html, deren Code folgend aufgeführt ist. Der Vereinfachung halber wurde der CSS-Code mit in den Script-Bereich der HTML-Datei geschrieben.
Aufgabe ist es nun, den DIV-Container "spielfeld" mit einer Grösse von: 950 Pixeln (Breite) und einer Höhe von 650 Pixeln wie folgt zu füllen:
Der Hintergrund des Divs soll komplett mit den Kacheln wie folgt ausgefüllt werden: Als Muster gibt es folgende Vorgabe: Sprite mit 1 = helles Bild, Sprite mit 2 = dunkles Bild.
Hier also erstmal das vorgegebene Muster:
121212...
212121...
121212...
.
.
usw.
Also immer abwechselnd, so das gleiche Sprites nicht nebeneinander liegen
Wie bekomm ich das nun hin? An welchem Element muss ich die Spritegrafiken nun aufhängen?
Hier der HTML/CSS-Code, den ich bereits habe:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
<title>test</title>
<!-- <link rel="stylesheet" type="text/css" href="css/style.css" /> -->
<style type="text/css">
<!--
* {
margin:0;
padding:0;
}
body {
font-size:10px;
font-family:'Verdana' 'Arial';
background-color:#00ff00;
}
#spielfeld {
width:950px;
height:650px;
background: url(bg-sprites.png) no-repeat top left;
}
.sprite-1{ background-position: 0 0; width: 50px; height: 50px; }
.sprite-2{ background-position: -100px 0; width: 50px; height: 50px; }
-->
</style>
</head>
<body></body>
</html>Und hier als Anlage die Grafikdatei: