Gegen Bilderklau - Das Original | Druckvorschau: Problem mit dem Einbauen des CSS

Geschrieben von heidefuerstin am 09.10.2008 um 03:59:

Problem mit dem Einbauen des CSS

Hallo,

habe mir hier ungeplanterweise die Nacht damit verbracht, Design coden zu lernen...
Immerhin schaff ich shconmal einen Teil des Grundgerüstes und hab so ein primitives Teil aufgebaut.

das ganze sieht dann in etwa so aus:

Foto Mignon *klick*

Dazu der Code

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Foto Mignon von Jana Posse</title>
<style>
<body background="http://mignon.bplaced.de/Jana/Sonstige/Testpage/Jana2.JPG">

<div id="Layer1" style="position: absolute;  left: 180px; top: 290px;">
  <iframe src="http://mignon.bplaced.de/Jana/Sonstige/Testpage/Jana1.JPG" name="frame" width="117" height="227" frameborder=0 scrolling="auto" noresize style="border: 0px" style="FILTER: chroma (color=#ffffff)" ;>
  </iframe>
</div>

<div id="Layer2" style="position: absolute;  left: 320px; top: 290px;">
  <iframe src="http://mignon.bplaced.de/Jana/Sonstige/Testpage/Start.html" name="main" width="420" height="290" frameborder=0 scrolling="auto" noresize style="border: 0px" style="FILTER: chroma (color=#ffffff)" ;>
  </iframe>
</div>

</body>
</html>

Alles befindet sich wirklich noch im primitivsten Anfangsstadium, daher bitte keine Kommentare zum Design o.ä. großes Grinsen

(Das ist ein 5 Minuten Werk in Paint und im Übrigen mein erstes *schäm*, dazu ein Schreibfehler & die Verpixelung dank Paint.. da kommt freunde auf, aber egal)

1. Kann mir jemand erklären, wie ich den Scrollbalken verschönern kann
2. Gibt es i-wo eine Erklärung dazu, wie ich jetzt in diesem halbwegs fertigem, wenn auch cnith gut aussehendem Design das Menü vercodet bekomme?

Geschrieben von peachNBlue am 09.10.2008 um 07:09:

Auf deiner Seite war alles weiss(zumindest bei mir) aber ich hab mir mal deinen Code genauer angeschaut Augenzwinkern

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Foto Mignon von Jana Posse</title>
<style>
<body background="http://mignon.bplaced.de/Jana/Sonstige/Testpage/Jana2.JPG">

<div id="Layer1" style="position: absolute;  left: 180px; top: 290px;">
  <iframe src="<--Link vom Menü-->" name="frame" width="117" height="227" frameborder=0 scrolling="auto" noresize style="border: 0px" style="FILTER: chroma (color=#ffffff)" ;>
  </iframe>
</div>

<div id="Layer2" style="position: absolute;  left: 320px; top: 290px;">
  <iframe src="http://mignon.bplaced.de/Jana/Sonstige/Testpage/Start.html" name="main" width="420" height="290" frameborder=0 scrolling="auto" noresize style="border: 0px" style="FILTER: chroma (color=#ffffff)" ;>
  </iframe>
</div>

</body>
</html>

1. Den Scrollbalken kannst du mit CSS anpassen, allerdings geht das, soweit ich weiß, nur im IE (also wird dort nur so angezeigt)
2. Du musst auch den Link vom Menue reinpacken ;D Und nicht nur den vom Lay

Geschrieben von heidefuerstin am 09.10.2008 um 10:04:

Okay, ich glaub dann lass ich das mit dem Scrollbalken.. css erstmal nciht großes Grinsen

aber wie bau ich den so ein menü-link auf großes Grinsen

da hab ich mal gar keine ahnung von...

Edit:
Achja & eigentlich sieht die Seite dann so aus (zumidnest mitm MF)

Geschrieben von peachNBlue am 09.10.2008 um 11:47:

Du weißt aber, wie man Links macht oder? Einfach mehrere untereinander, als HTML-Seite abspeichern und fertig Augenzwinkern

Die Adresse verlinkst du dann im Code Augenzwinkern

Geschrieben von heidefuerstin am 09.10.2008 um 12:23:

Axhso..
ist ja einfach.. Hätte mir das viel komplizierter vorgestellt.. großes Grinsen

Freundin hat mir aus Langeweile ein Desi gemach..
Ich hab es verlinkt usw.
Aber..
Wieso werden die Links blau & unterstrichen...?
Was muss ich ändern?

Link

Dazu dieserMenü-Code:

code:

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:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>

  <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
  <title>Startseite</title>


</head>
<body>

<p></p>

<p align="left">
<a href="http://mignon.bplaced.de/Jana/Sonstige/Testpage/2/Start.html" target="main" style="text-decoration: none;"><font color="#000000">Start</font></a>
<br>

<a href="http://mignon.bplaced.de/Jana/Sonstige/Testpage/2/Impressum.html" target="main" style="text-decoration: none;">
<font color="#000000">Impressum</font></a>
<br>

G&auml;stebuch
<br>

Links
<br>

<br>

Fotografin
<br>

Ausr&uuml;stung
<br>

Termine
<br>

Portfolio
<br>

<br>

vRh-Archiv
<br>

Angebot
<br>

</p>

</body>
</html>

Edit:
Ich hab es jetzt durch eine Style-Unterdrückung geschafft, aber wie kann ich das machen, ohne es unterdrücken zu müssen?

Geschrieben von Melli am 09.10.2008 um 12:52:

Gut, so kannst du es machn, musst es dann aber immer einzeln machn.
Willst du es anders machn, dann arbeite mit CSS.

Für das hier in den <head>-Bereich ein:

code:

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:

<style type="text/css">
A:link {
font-family: SCHRIFTART;
font-size: SCHRIFTGRÖSSE entweder in px oder pt;
color:SCHRIFTFARBE;
TEXT-DECORATION: none*;}


A:active {
font-family: SCHRIFTART;
font-size: SCHRIFTGRÖSSE entweder in px oder pt;
color:SCHRIFTFARBE;
TEXT-DECORATION: none*;}

A:visited {
font-family: SCHRIFTART;
font-size: SCHRIFTGRÖSSE entweder in px oder pt;
color:SCHRIFTFARBE;
TEXT-DECORATION: none*;}


A:hover { 
font-family: SCHRIFTART;
font-size: SCHRIFTGRÖSSE entweder in px oder pt;
color:SCHRIFTFARBE;
TEXT-DECORATION: none*;}
</style>

*none steht hier für keine Dekoration. Es geht aber auch underlined etc (;

Du kannst wahlweise aber auch eine style.css-Datei anlegen. Tutorials dazu hier: » da eines. Suchst du noch welche einfach hier auf GB mal nach 'CSS' oder 'Stylesheet' suchen (;
Möchtest du noch Linkeffekte hinzufügen, wie z.B. dass er unterstrichen ist, wenn du draufdrückst oder sowas, dann » hier nachlesen (;

Geschrieben von heidefuerstin am 09.10.2008 um 13:04:

das css hab ich schon geschafft.. großes Grinsen

der akzeptiert bloß nciht meine Zentrierung >.<.. großes Grinsen

das, was dumir geschrieben hast, sollte ich das noch in die css datei einfügen?

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:

BODY {
color: #000000; /* 
text-align : center; /* 
background-image: http://mignon.bplaced.de/Jana/Sonstige/Testpage/2/design1.png; /* 
font-size:10pt ; /* 
font-family: Arial /* 
background-attachment: scroll; /* 
background-position:0px 0px; /* hintergrundfarbe*/
scrollbar-3dlight-color: #000000;
scrollbar-arrow-color: #ffffff;
scrollbar-darkshadow-color: #000000;
scrollbar-face-color: #000000;
scrollbar-highlight-color: #000000;
scrollbar-shadow-color: #000000;
scrollbar-track-color: #000000;
}

Das hab ich..

text-align : center; /*
das akzeptiert dernciht, bzw. führt er nciht aus..
was ist falsch?

soll ich das von dir geschriebene ausfüllen und hintendran hängen?

Geschrieben von Melli am 09.10.2008 um 13:34:

Ja, ab <style type="text/css"> einfügen (; Das </style> am Schluss natürlich weglassen (;
Und ansonsten nur ausfüllen noch. Am besten machst du da noch das text-align:center; bei jeweils A:... zu ;>

Und nimm mal aus deinem Code von der Seite <p align="left">
raus (;

Geschrieben von heidefuerstin am 09.10.2008 um 13:43:

Habe das jetzt mal hintenran gefüt.. zimelich genau so:

code:

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:
36:
37:
38:
39:
40:
41:
42:

BODY {
color: #000000; /* 
text-align : center; /* 
background-image: http://mignon.bplaced.de/Jana/Sonstige/Testpage/2/design1.png; /* 
font-size:10pt ; /* 
font-family: Arial /* 
background-attachment: scroll; /* 
background-position:0px 0px; /* hintergrundfarbe*/
scrollbar-3dlight-color: #000000;
scrollbar-arrow-color: #ffffff;
scrollbar-darkshadow-color: #000000;
scrollbar-face-color: #000000;
scrollbar-highlight-color: #000000;
scrollbar-shadow-color: #000000;
scrollbar-track-color: #000000;
}

A:link {
font-family: SCHRIFTART;
font-size: SCHRIFTGRÖSSE entweder in px oder pt;
color:SCHRIFTFARBE;
TEXT-DECORATION: none*;}


A:active {
font-family: Arial;
font-size: 10pt;
color:#000000;
TEXT-DECORATION: none*;}

A:visited {
font-family: Arial;
font-size: 10pt;
color:#000000;
TEXT-DECORATION: none*;}


A:hover { 
font-family: Arial;
font-size: 10pt;
color:#000000;
TEXT-DECORATION: none*;}

allerdings ändert das ncihts:

Link

habe das Impressum nochmal neu geschrieben, diesmal ohne jegliche textveränderung..
nur das grundgerüst + text

ich glaub, ich verzweifel noch

Geschrieben von Melli am 09.10.2008 um 14:01:

style.css

code:

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:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:

BODY {
color: #000000; 
text-align : center;
background-image: http://mignon.bplaced.de/Jana/Sonstige/Testpage/2/design1.png; 
font-size:10pt;
font-family: Arial;
background-attachment: scroll; 
background-position:0px;
scrollbar-3dlight-color: #000000;
scrollbar-arrow-color: #ffffff;
scrollbar-darkshadow-color: #000000;
scrollbar-face-color: #000000;
scrollbar-highlight-color: #000000;
scrollbar-shadow-color: #000000;
scrollbar-track-color: #000000;
}

A:link {
text-align : center;
font-family: Arial;
font-size: 10pt;
color:#000000;
TEXT-DECORATION: none;}


A:active {
text-align : center;
font-family: Arial;
font-size: 10pt;
color:#000000;
TEXT-DECORATION: none;}

A:visited {
text-align : center;
font-family: Arial;
font-size: 10pt;
color:#000000;
TEXT-DECORATION: none;}


A:hover { 
text-align : center;
font-family: Arial;
font-size: 10pt;
color:#000000;
TEXT-DECORATION: none;}

Das Menü dann so:

code:

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:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<link rel="stylesheet" href="style.css">

  <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
  <title>Startseite</title>


</head>
<body>

<p></p>

<a href="http://mignon.bplaced.de/Jana/Sonstige/Testpage/2/Start.html" target="main">"Start</font></a>
<br>

<a href="http://mignon.bplaced.de/Jana/Sonstige/Testpage/2/Impressum.html" target="main">
Impressum</font></a>
<br>

G&auml;stebuch
<br>

Links
<br>

<br>

Fotografin
<br>

Ausr&uuml;stung
<br>

Termine
<br>

Portfolio
<br>

<br>

vRh-Archiv
<br>

Angebot
<br>

</p>

</body>
</html>