Buttons mit CSS

m3alde · 24 Juni 2008

Hallo,

ich wollte Buttons machen, mit mouseover effect. Ich habe nun diesen Cod gefunden:

Code:

<html>
 <head>
<title></title>
<style type="text/css">

a.button   { display:block;
             background-image:url(bilder/Unbenannt-1.png);
             width:200px; height:70px 
            }


a.button:hover { background-image:url(bilder/Unbenannt-112.png); } 


body { background-image:url(bilder/background.jpg); }



</style>

<body>

  <a href="#" class="button"> </a>

</body>
</html>

Funktioniert ja auch soweit ganz gut, nur ich weiss nicht wie ich nun noch einen Button machen kann. Ich habe die Buttons mit einer Speziellen schriftart gestaltet deshalb habe ich auch gleich schon auf die .png datei des buttons draufgeschrieben wo er hinführen wird. Z.B. "Home" oder so ;)
Weiss jemand die ich nun noch mehr verschiedene Buttons machen kann, oder kennt jemand nen besseren cod? habe schon bei google geguckt aber nichts wirklich gutes gefunden...

mfg m3alde

Efchen · 24 Juni 2008

So wie der Code da steht, gilt das für alle Links der Klasse "button".
Wenn Du unterschiedliche Hintergrundgrafiken willst, könntest Du weitere Klassen einführen, oder sinnvoller, wenn es jeweils nur ein Button mit der selben Grafik ist, statt Klassen IDs. (statt "class" dann "id" und statt "." im Stylesheet dann "#", also z.B. "a#meineID2"). IDs dürfen nur einmal auf einer Seite vorkommen.

Gruß,
-Efchen

P.S.: Ich würde es nicht "mouseover"-Effekt nennen, weil das leicht mit JavaScript und dessen Event-Handler "onMouseOver" verwehcselt werden kann. Das hier ist CSS.

m3alde · 24 Juni 2008

Ich habe mir nun überlegt, das ich auf meine schöne Schriftare verzichten werde. Ich habe es nun so gemacht wie hier, und habe mir den code dann noch etwas abgeändert:
HTML lernen und die eigene Homepage erstellen - HTML lernen - HTML Kurs / Seminar

Ich habe aber direckt noch eine frage:

Ich habe meine index.html ganz oben(im obenliegenden Ordner). Ich habe nun einen unterliegenden Ordner der heißt "navi" hier liegt die navi.html die ich in die index.html per iframe eingebunden haben. Ich muss ich es aber jetzt machen das er einen link der in der navi.html steht in einem Container öffnet der in der index.html festgelegt ist?

Ich hoffe ihr habt verstanden was ich meine sonst sagt bescheid.

Efchen · 24 Juni 2008

Du kannst keine Seite in einem beliebigen Container einer bestehenden Seite öffnen. Das geht nur mit Frames. Frames sind aber aus etlichen Gründen, die Du leicht rausfinden kannst, nicht zu empfehlen. Deine Navigation ist besser per serverseitigem include eingebunden.

Ansonsten: Bescheid. Es ist mir nicht klar, ob Deine Frage eine Filesystem-Frage ist, weil Du nicht weißt, wie Du Deine Links relativ adressierst, oder ob sich die Frage auf die Framerei bezog, die ich Dir ohnehin ausreden will :-)

Gruß,
-Efchen

m3alde · 24 Juni 2008

Also meine frage hat nichts mit Frames zutun da ich nicht mit frames arbeiten möchte, weil wie du schon sagtest gibt es viele Gründe weshalb frames "nicht so toll sind".

Also mein Code der index.hzml sieht so aus:

Code:

<html>
 <head>
<title>m3al.de#´s Home</title>
<style type="text/css">
  

       
body            {
                background:#B3B3B3;
                }
   
#container_head {
                position:absolute; 
                width:1400px; 
                height:150px; 
                background-image:url(banner.png); 
                border: 0px;
                margin-top:15px;
                margin-left:150px;
                

                
                }

#container_main {
                position:absolute; 
                width:1400px; 
                height:600px; 
                background-color:black; 
                border: 0px;
                margin-top:300px;
                margin-left:150px;
               
                   
                }

#container_navi {
                position:absolute; 
                width:1400px; 
                height:90px; 
                border: 0px;
                margin-top:180px;
                margin-left:150px;
                

                 }

</style>
 </head>

<body>

<div id="container_head">
  

</div>


<div id="container_navi">

<iframe src="navi/new.html" name="main" height="100%" width="100%">

</iframe>


</div>


<div id="container_main">
<iframe src="main.html" name="main" height="99%" width="100%">
</iframe>

</div>

</center>

</div>
</body>
<html>

Nun ist meine new.html in dem unterordner "navi". In der navi.html sind die navi links. Diese links sollen nun aber in dem "main_container" geöffnet/angezeigt werden. Nur ich weiss nicht wie ich das anstellen soll.
ich muss ja was beim befehl <...target=""> eintragen.

neuroleptika · 25 Juni 2008

m3alde schrieb:
Also meine frage hat nichts mit Frames zutun da ich nicht mit frames arbeiten möchte, weil wie du schon sagtest gibt es viele Gründe weshalb frames "nicht so toll sind"................

Iframes sind Frames mit all deren Nachteilen. Für die Verlinkung gelten die gleichen Regeln wie für Framesets.
Der einzige relevante Unterschied zu Framesets ist die Einbindung in eine html-Datei mit weiterem Inhalt.

Efchen · 25 Juni 2008

m3alde schrieb:
Also meine frage hat nichts mit Frames zutun da ich nicht mit frames arbeiten möchte

Code:

<iframe src="navi/new.html" name="main" height="100%" width="100%"> <iframe src="main.html" name="main" height="99%" width="100%">

Dein Code straft Dich Lügen!

Ein einzelnes Element (iframe) mit einem div zu gruppieren, macht keinen Sinn.
Außerdem würde ich nicht position:absolute verwenden, sondern lieber float.

Wie gehts jetzt weiter, da wir Dich der Nutzung von Frames überführt haben? :-)

m3alde · 25 Juni 2008

Schei*e stimmt ja eig. hab jetzt nur an frameset und so gedacht, nicht daran das iframes ja auch frames sind

Wie es weiter geht?^^ Ka, ich werde nun mal gucken das ich diese blöden frames wegbekomme und dafür eine alternative finde ;)

Edit:

Ok, ok frames sind schei*e aber ich werde die iframes trozdem verwenden da mich am frameset ja stöhrt das man z.B. eine seite nicht zu den favoriten hinzufügen kann da immer nur die eine URL in der Adresszeile steht. Und so.

Aber mir is nun aufgefallen das ich bei meinem iframe folgendes angegeben habe

Code:

<iframe src="navi/new.html" name="main" height="100%" width="100%">

</iframe>

Damit habe ich mir ja ein eigentor geschossen da wenn ich nun beim link schreibe "<...target="main"> dieser link natürlich, wie soll es auch anders sein, im navi frame geöffnet wird da ich da ja main angegeben habe.
Habe es nun so geändert:

Code:

<iframe src="navi/new.html" name="navi" height="100%" width="100%">

</iframe>

Nun wir der link im main fenster/container geöffnet, bei dem ich als "name="main"" schon angegeben hatte :)

Efchen · 25 Juni 2008

m3alde schrieb:
Ka, ich werde nun mal gucken das ich diese blöden frames wegbekomme und dafür eine alternative finde

Es gibt keine Alternative für Frames.

Ok, ok frames sind schei*e aber ich werde die iframes trozdem verwenden da mich am frameset ja stöhrt das man z.B. eine seite nicht zu den favoriten hinzufügen kann da immer nur die eine URL in der Adresszeile steht. Und so.

Ist idR eine leichte Entscheidung für den Webmaster. Denn nicht er hat die Probleme mit den Frames, sondern nur seine Besucher. Betrifft ihn ja nicht.
Auch mit iFrames hast Du das Problem mit den Bookmarks. Das ändert sich dadurch nicht.

Gruß,
-Efchen

m3alde · 25 Juni 2008

Ach shit -.-

Stimmt. Das is aber auch blöd mit den frames.
Dann weiss ich nun nicht mehr weiter, ich will ja meine seite haben wo alles gleich bleibt außer ein Feld wo dann jeweils das erscheint wo man dann eben in der navigation drauf klickt.

Efchen · 25 Juni 2008

Wie ich schon oben sagte, serverseitiges Include ist Dein Freund. SSI oder PHP z.B. Wie das geht, wird hier pro Tag ungefähr mehrmals durchgekaut. (Das war der Hinweis auf die Suchfunktion :))

assmaje · 25 Juni 2008

m3alde schrieb:
Ach shit -.-

Stimmt. Das is aber auch blöd mit den frames.
Dann weiss ich nun nicht mehr weiter, ich will ja meine seite haben wo alles gleich bleibt außer ein Feld wo dann jeweils das erscheint wo man dann eben in der navigation drauf klickt.

http://www.html.de/php/19289-webseite-dynamisch-gestalten.html

m3alde · 25 Juni 2008

PHP kann ich "noch" nicht wirklich :(.

SSI werde ich nun mal googlen und hier in der SuFu vom Forum suchen ;)

Efchen · 25 Juni 2008

Wenn man nur include() verwenden will, muss man nicht wirklich PHP programmieren können. Es ist ja nur ein einzelner Befehl. Aber mit SSI gehts genauso einfach. Es muss halt vom Webserver her möglich sein. Beides.

m3alde · 25 Juni 2008

Das es anscheinend nur ein befehl ist wusste ich nicht^^.

Werde mir nun das von "assmaje" durchlesen und dann mal SSI + PHP suchen was du meintest "Efchen"

Auf jedenfall schonmal an dieser stellen rechtherzlichen Dank :)

Edit:

Das was "assmaje" gepostet hat hat ja schon direckt was mit PHP und include zutun...

m3alde · 25 Juni 2008

Hab mir das von "assmaje" nun alles mal durchgelesen und auch versucht aber ich verstehe das noch nicht wirklich.
Keine Ahnung ob ich zu dumm bin, nicht richtig gelsen habe oder etwas überlesen habe.

Aber ich verstehe insgesammt nicht wo ich wann und wie den include code eingeben muss :(

Sry fürs Doppelt posten hab erst danach gesehn das ich ja noch editieren kann -.-

assmaje · 25 Juni 2008

m3alde schrieb:
Hab mir das von "assmaje" nun alles mal durchgelesen und auch versucht aber ich verstehe das noch nicht wirklich.
Keine Ahnung ob ich zu dumm bin, nicht richtig gelsen habe oder etwas überlesen habe.

Aber ich verstehe insgesammt nicht wo ich wann und wie den include code eingeben muss :(

Sry fürs Doppelt posten hab erst danach gesehn das ich ja noch editieren kann -.-

Lies es noch mal durch, versuch es noch mal und poste uns dann dein Ergebnis.

m3alde · 25 Juni 2008

Also, ich hab da jetzt was hinbekommen. Aber ich weiss noch nicht genau was ich nun aufeinmal gemacht habe das es funktioniert. Ich werde mich nun nochmal dran setzen. Bis 19 uhr danach geh ich erstmal Deutschland - Türkei gucken

Also ich werde mich jetzt und morgen dransetzen, alles überarbeiten und dann euch den Code posten wenn alles klappt, wenn nicht melde ich mich sowieso wieder ^^( wenn ich es nicht alleine schaffe )

Also erstmal danke und wir "sehen" uns

mfg m3al.de#

Edit:

Läuft soweit. Wie muss ich den Code*² erweitern damit ich wenn ich auf andere Links klicke das diese dann im mainfenster geöffnet werden?

*²

Code:

        <?php
        if($_GET['section'] == "main") {
          include "main/min.php";
        }
        ?>

Edit2:

Hab den Code nun so verändert:

Code:

        <?php
        if($_GET['section'] == "main") {
          include "main/min.php";
    
        if($_GET['section'] == "uebermich")
          include "uebermich/uebermich";



        }
        ?>

Und der dazugehörige link sieht dann so aus

Code:

<a id="uebermich" href="index.php?section=uebermich">Über mich</a>

Wenn ich aber nun auf den Link klicke erscheint nichts im "main" Fenster. Der Code ansich geht aber.
Wisst ihr wieso das kommt das er nichts im "main" Fenster anzeigt?

Wisst ihr noch weiter?

Hoffe schon.

Efchen · 27 Juni 2008

m3alde schrieb:
Läuft soweit. Wie muss ich den Code*² erweitern damit ich wenn ich auf andere Links klicke das diese dann im mainfenster geöffnet werden?

In dem Code ist kein Link.
Wenn Du include verwendest, dann hast Du doch keine "Fenster" mehr im Sinne von Frames. Was genau willst Du? Ein Link öffnet sich immer im aktuellen Fenster. Da ist er gut aufgehoben.

Code:
Code:

<a id="uebermich" href="index.php?section=uebermich">Über mich</a>

Wenn ich aber nun auf den Link klicke erscheint nichts im "main" Fenster.

Du hast doch gar keine "Fenster" im Sinne von Frames. Du denkst in Frames, das musst Du Dir abgewöhnen. Wenn Du auf den Link klickst, öffnet der eine neue Seite im aktuellen Fenster. So ist es richtig.

Wisst ihr wieso das kommt das er nichts im "main" Fenster anzeigt?

Was für ein "main Fenster"?

Gruß,
-Efchen

m3alde · 27 Juni 2008

Ok, ok.

Nicht Fenster sondern Seite ich habe verstanden.

Also ich habe den Code ja so erweitert wie ich es schon geschrieben habe. Ist das so Richtig?
Der erste Code den ihr mir geschrieben habt den ich dann erweitert habe der klappt ja. Wenn ich nun auf Startseite klicke kommt auch die gleiche seite nur da wo sonst der main Frame war ist nun eben die main.php geladen worden.

Aber so wie ich den Code nun erweitert habe geht es nicht das wenn ich auf Über mich in der navi klicke das dann die uebermich.php auf der seite im main_container geladen wird. Und ich weiss nicht woran es liegt.

Buttons mit CSS

Neues Mitglied

Efchen

Guest

Neues Mitglied

Efchen

Guest

Neues Mitglied

Aktives Mitglied

Efchen

Guest

Neues Mitglied

Efchen

Guest

Neues Mitglied

Efchen

Guest

Neues Mitglied

Neues Mitglied

Efchen

Guest

Neues Mitglied

Neues Mitglied

Neues Mitglied

Neues Mitglied

Efchen

Guest

Neues Mitglied