Gegen Bilderklau - Das Original (https://www.gegen-bilderklau.net/index.php)
- Design, Website, Copyright (https://www.gegen-bilderklau.net/board.php?boardid=80)
--- Homepagehilfe (https://www.gegen-bilderklau.net/board.php?boardid=27)
---- Tutorials und FAQ (https://www.gegen-bilderklau.net/board.php?boardid=45)
----- [HTML] Design mit Untermenu coden (https://www.gegen-bilderklau.net/thread.php?threadid=116325)


Geschrieben von Ponyhof am 21.08.2007 um 16:26:

  Design mit Untermenu coden

Halloe,

. funktioniert IE, AOLbroweser, MF
. HTML Kenntnisse
. Div-Design

Im Designcode kann man die Farbe der Scrollbalken einstellen und den Hintergrund, falls ein Bildschwirm größer als das Design.
Achtung: Im Internet Explorer werden die weißen Teile eines Bildes transparent.

Step 1:
Wir beginnen eine HTML Seite ganz normal, öffnet dazu am besten erstmal den normalen Windowseditor. In diesem Code bestimmt ihr erstmal nur den Namen eures Hofes, Seite oder anderes. Diesen erscheint dann oben, wo nun Gegen Bildeklau - ... steht.
code:
1:
2:
3:
4:
5:
6:
7:
<html>
<head>
<title>Name eures Hofes</title>
</head>
<body>
</body>
</html> 


Step 2:
Jetzt fangen wir an das CSS in den Kopf ( <head></head> ) einzubauen. Ich baue es grundsätzlich unter dem Titel ein, es geht eigentlich aber auch drüber.
<style type="text/css"> damit gebt ihr an, was ihr jetzt machen wollt, dann beginnt der Code.
code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
<style type="text/css">
<!--
body { scrollbar-highlight-color:#ffffff;
scrollbar-arrow-color:#ffffff;
scrollbar-3dlight-color:#ffffff;
scrollbar-base-color:#ffffff;
scrollbar-darkshadow-color:#ffffff;
scrollbar-face-color:#ffffff;
scrollbar-shadow-color:#ffffff;
-->
</style>


Dieses fügt ihr dann in euren HTML Code ein und euer Scrollbalken wurde definiert.

code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
<html>
<head>
<title>Name eures Hofes</title>
<style type="text/css">
<!--
body { scrollbar-highlight-color:#ffffff;
scrollbar-arrow-color:#ffffff;
scrollbar-3dlight-color:#ffffff;
scrollbar-base-color:#ffffff;
scrollbar-darkshadow-color:#ffffff;
scrollbar-face-color:#ffffff;
scrollbar-shadow-color:#ffffff;
-->
</style>
</head>
<body>
</body>
</html> 


Step 3:
Weiter mit der Bestimmung des Hintergrundes mit CSS, auch des Designs und der Ausrichtung des Designs. Diesmal öffnen wir keine neue Angabe sondern fügen es einfach im schon Gemachten ein. Was ich in Klammern dazugeschrieben habe müsst ihr löschen.

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:
<html>
<head>
<title>Ponyhof Lysingur</title>
<style type="text/css">
<!--
body { scrollbar-highlight-color:#ffffff;
scrollbar-arrow-color:#ffffff;
scrollbar-3dlight-color:#92d648;
scrollbar-base-color:#92d648;
scrollbar-darkshadow-color:#92d648;
scrollbar-face-color:#92d648;
scrollbar-shadow-color:#92d648;

background-image:url("Adresse eures Designs");
background-position: top left; ( oben links, top right = oben rechts )
background-repeat: no-repeat; ( keine Wiederholung, repeat = Wiederholung )
background-color:#ffffff; }
-->
</style>
</head>
<body>
</body>
</html>


Step 3:
So, nun legt ihr die Frames fest. Menu, Untermenu, Main in diesem Fall.
Jetzt im DIV und iframe festlegen. Die <div> Zahlen left und top geben die Position an. Bitte einmal reingucken Rot umrandete Zahlen sind für den Div-tag. Die erste ist left, die zweite ist top. dann im iframe, als erstes Mal den Namen angeben. (Achtung: Taucht beim Verlinken wieder auf ) width ist die erste Zahl die blau umrandet ist, also die Breite des Frames. An der Breitseite steht es auch nochmal und height dann logischerweise die Höhe (= Dann fügt man Die ADRESSEDESMAINS ( Adresse der Mainseite ) ein und ansonsten lasst die Einstellung so. Unten noch Erläuterungen für Neugierige. Das macht ihr halt mit jedem Frame. So könnt ihr auch Newsframes einbauen.

code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
<div style="left: 262px; top: 233px; position: absolute;">
<iframe name="main" width="632px" height="430px" src="ADRESSEDESMAINS" frameborder="0" scrolling="auto" align="top right" style="Filter: chroma (color=#ffffff)" ;> </iframe> </div>

<div style="left: 420px; top: 284px; position: absolute; ">
<iframe name="menu" width="526px" height="38px" src="ADRESSE DES MENUS" frameborder="0" scrolling="auto" align="top right" style="Filter: chroma (color=#ffffff)" ;> </iframe> </div>

<div style="left: 84px; top: 377px; position: absolute; ">
<iframe name="untermenu" width="162px" height="354px" src="ADRESSE DES UNTERMENUS" frameborder="0" scrolling="auto" align="top right" style="Filter: chroma (color=#ffffff)" ;> </iframe> </div>


Der gesamte 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:
<html>
<head>
<title>Ponyhof Lysingur</title>
<style type="text/css">
<!--
body { scrollbar-highlight-color:#ffffff;
scrollbar-arrow-color:#ffffff;
scrollbar-3dlight-color:#92d648;
scrollbar-base-color:#92d648;
scrollbar-darkshadow-color:#92d648;
scrollbar-face-color:#92d648;
scrollbar-shadow-color:#92d648;

background-image:url("Adresse eures Designs");
background-position: top left; ( oben links, top right = oben rechts )
background-repeat: no-repeat; ( keine Wiederholung, repeat = Wiederholung )
background-color:#ffffff; }
-->
</style>
</head>
<body>

<div style="left: 262px; top: 233px; position: absolute;">
<iframe name="main" width="632px" height="430px" src="ADRESSEDESMAINS" frameborder="0" scrolling="auto" align="top right" style="Filter: chroma (color=#ffffff)" ;> </iframe> </div>

<div style="left: 420px; top: 284px; position: absolute; ">
<iframe name="menu" width="526px" height="38px" src="ADRESSE DES MENUS" frameborder="0" scrolling="auto" align="top right" style="Filter: chroma (color=#ffffff)" ;> </iframe> </div>

<div style="left: 84px; top: 377px; position: absolute; ">
<iframe name="untermenu" width="162px" height="354px" src="ADRESSE DES UNTERMENUS" frameborder="0" scrolling="auto" align="top right" style="Filter: chroma (color=#ffffff)" ;> </iframe> </div>

</body>
</html>


scrolling: yes - Ja, no - Nein, auto - Automatisch, bei Bedarf
align: Sollte mit der oberen Angabe background-position: übereinstimmen, ansonsten verschieben sich die Frames. Möglich top right, top left, top center
style="Filter: chroma (color=#fffff)" steht dafür das eure Frames transparent sind. Im IE werden leider auch teile weißer Bilder transparent.

MfG;
Ponyhof



Geschrieben von katt am 21.08.2007 um 18:18:

  RE: [Tutorial] Design mit Untermenu coden

geht das auch für Oyla ?



Geschrieben von Ponyhof am 22.08.2007 um 13:04:

 

Ähm, ich weiß nicht ob der den Code nimmt ^^



Geschrieben von katt am 22.08.2007 um 16:16:

  RE: [Tutorial] Design mit Untermenu coden

Ich probiers mal smile sag dir dan bescheid Augenzwinkern Danke


-edit-

geht schon aber ich denke da muss ein profi ran Augenzwinkern
Kannst du es mir machen ?
Bitte ?



Geschrieben von Ponyhof am 25.08.2007 um 10:25:

 

Nee xp Sorry, weil ich das nichtmehr machen wollte steht ihr der Tutorial.

MfG;
Ponyhof



Geschrieben von katt am 25.08.2007 um 17:19:

 

schade unglücklich



Geschrieben von nathalie25 am 25.11.2007 um 12:34:

 

Hey, ich hatte auch am Anfang Probleme beim oyla coden, geht aba eigentl. ganz einfach!!! Wenn du weiterhin Hilfe brauchst, schreib mir per PN Augenzwinkern



Geschrieben von Schatti am 27.11.2007 um 14:54:

 

-



Geschrieben von sunnygirl148 am 01.02.2008 um 14:07:

  Hilfe

Hey!
Kann mir vllt. jemand helfen. Bei mir sieht das ganze so aus.

Das ist mein code:

<html>
<head>
<title>Gestüt Albershof</title>
<style type="text/css">
<!--
body { scrollbar-highlight-color:#ffffff;
scrollbar-arrow-color:#ffffff;
scrollbar-3dlight-color:#ffffff;
scrollbar-base-color:#ffffff;
scrollbar-darkshadow-color:#ffffff;
scrollbar-face-color:#ffffff;
scrollbar-shadow-color:#ffffff;

background-image:http://sunnygirl148.su.funpic.de/gestuet_albershof_dottedline.png;
background-position: 60,300 top left; 786,300 top right
background-repeat: no-repeat;
background-color: b9d79d; }
-->
</style>

</head>
<body>
<div style="left: 60px; top: 300px; position: absolute;">
<iframe name="main" width="728px" height="418px" src="http://sunnygirl148.su.funpic.de/Main.PNG" frameborder="0" scrolling="auto" align="top right" style="Filter: chroma (color=#ffffff)" ;> </iframe> </div>

<div style="left: 806px; top: 236px; position: absolute; ">
<iframe name="menu" width="171px" height="293px" src="http://sunnygirl148.su.funpic.de/Menu.PNG" frameborder="0" scrolling="auto" align="top right" style="Filter: chroma (color=#ffffff)" ;> </iframe> </div>

<div style="left: 807px; top: 41px; position: absolute; ">
<iframe name="untermenu" width="168px" height="192px" src="http://sunnygirl148.su.funpic.de/Untermenu.PNG" frameborder="0" scrolling="auto" align="top right" style="Filter: chroma (color=#ffffff)" ;> </iframe> </div>

Wäre sehr, sehr dankbar, wenn mal irgendjemand drüberschauen würde, da es mein erster "professioneller" vrh ist und ich noch nicht direkt am Anfang aufgeben möchte.

LG,
sunnygirl148



Geschrieben von AvrilLavigneForEver am 14.08.2008 um 15:13:

 

also hier mal mein code:

<html>
<head>
<title>Gestüt Ammerland</title>
<style type="text/css">
<!--
body { scrollbar-highlight-color:#ffffff;
scrollbar-arrow-color:#ffffff;
scrollbar-3dlight-color:#ffffff;
scrollbar-base-color:#ffffff;
scrollbar-darkshadow-color:#ffffff;
scrollbar-face-color:#ffffff;
scrollbar-shadow-color:#ffffff;

background-image:url http://vrhrsammerland.vr.funpic.de/10gfnzt.png;
background-position: center;
background-repeat: no-repeat;
background-color:#ffffff; }
-->
</style>
</head>
<body>
<div style="left: 571px; top: 337px; position: absolute;">
<iframe name="main" width="632px" height="430px" src="http://vrhrsammerland.vr.funpic.de/home.html" frameborder="0" scrolling="auto" align="top right" style="Filter: chroma (color=#ffffff)" ;> </iframe> </div>

<div style="left: 119px; top: 199px; position: absolute; ">
<iframe name="menu" width="526px" height="38px" src="http://vrhrsammerland.vr.funpic.de/Menue.html" frameborder="0" scrolling="auto" align="top right" style="Filter: chroma (color=#ffffff)" ;> </iframe> </div>

<div style="left: 161px; top: 207px; position: absolute; ">
<iframe name="untermenu" width="162px" height="354px" src="http://vrhrsammerland.vr.funpic.de/dorf.html" frameborder="0" scrolling="auto" align="top right" style="Filter: chroma (color=#ffffff)" ;> </iframe> </div>
</body>
</html>

aber da kommt das: http://vrhrsammerland.vr.funpic.de/Unbenannt1.html

Kannst du mir vllt. helfen? Was hab hab ich da falsch gemacht?



Geschrieben von Ponyhof am 15.08.2008 um 17:05:

 

Die Seite geht nicht :3

background-image:url(http://vrhrsammerland.vr.funpic.de/10gfnzt.png);

() hat dir gefehlt ^^

MfG;
Ponyhof



Geschrieben von Alex96 am 18.08.2008 um 09:32:

 

das mit dem Mainadesse und so verstehe ich nich...kan mir das irgend ein schlauer erklären???

LG Alexandra



Geschrieben von Annika101 am 03.09.2008 um 21:34:

 

Das mit der Main adresse verstehe ich auch noch nicht so ganz genau also ja bitte nochmal alles ab stepp 3 für dumme fröhlich



Geschrieben von Ponyfreak94 am 23.09.2008 um 15:50:

 

ich bracuh hiolfe beim coden eines unutermenüs



Geschrieben von Ponyhof am 29.09.2008 um 10:22:

 

Damit kann aber niemand was anfangen.
Entweder beschreibst du dein Problem oder lässt es mit dem Untermenu (;

Mainadresse ist die Startseite, die beim Besuch der Page als erstes geöffnet wird (: Oder nach dem Enterklick ^^

MfG;
Ponyhof



Geschrieben von Alex96 am 15.10.2008 um 20:43:

 

Zitat:
Original von Ponyhof
Damit kann aber niemand was anfangen.
Entweder beschreibst du dein Problem oder lässt es mit dem Untermenu (;

Mainadresse ist die Startseite, die beim Besuch der Page als erstes geöffnet wird (: Oder nach dem Enterklick ^^

MfG;
Ponyhof


ah... das war auch für mich ferständlich... *bin der dümmste schlaubi achlupf Augenzwinkern *

nun gleich nächste frage unglücklich : woher weis der computer wann er was ins untermenü öfnen muss *krüme verwirrt l*



Geschrieben von Ponyhof am 15.10.2008 um 20:58:

 

durch die angaben target=untermenu, oder wie du es genannt hast.
Du legst ja eine eigene Seite für das Menu an, dort erstellst du die Links. Und das weiß nicht der PC, das ist HTML, das das weiß großes Grinsen

Hoffe das hast du auch verstanden.

MfG;
Ponyhof



Geschrieben von Alex96 am 15.10.2008 um 21:06:

 

aso.. glaub schon... kuk mal PN



Geschrieben von Nika am 26.12.2008 um 00:18:

 

Zitat:
Original von Ponyhof
durch die angaben target=untermenu, oder wie du es genannt hast.
Du legst ja eine eigene Seite für das Menu an, dort erstellst du die Links. Und das weiß nicht der PC, das ist HTML, das das weiß großes Grinsen

Hoffe das hast du auch verstanden.

MfG;
Ponyhof


okee das habe ich jetzt verstanden ...

aber das mit der Adresse des Mains nicht so ganz. ich weiß nicht was damit gemeint ist (bitte einmal für ganz dumme)



Geschrieben von Nika am 26.12.2008 um 20:16:

 

hmm

ja oke hmm.

ich versuchs nochmal, dann schreib ich ob ich das verstanden hab oder nicht ^^


Forensoftware: Burning Board, entwickelt von WoltLab GmbH