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

Mit CSS einen "nicht sichtbaren" bereich einen Link zuordnen, wie geht das...?

hannover96xd

Mitglied
Moin,

ich würde gerne mal wissen ob man mit CSS, oder auch evtl. mit HTML Links bestimmten Bereichen zuordnen kann.

Bsp:
Ich habe mit einem Grafikprogramm ein Hintergrund für meine Website erstellt, kann ich nun ohne die einzelnen Bilder rauszuschneien und einzeln wieder in der html Datei zusammenzusetzen, einen Link definieren, der z.b. von rechts 200px und von oben 20px entfernt ist und die anklickbare Fläche des Links soll z.b. 20px breit und hoch sein?

Gibt es dafür einen code?

Danke für eure tolle Hilfe!


L.G.

hannover96xd
 
Möglich ist das schon. Aber so wie du es schilderst, klingt es nach keiner guten Lösung. Mach aus dem Link ein Blockelement, gib ihm width, height und verschiebe ihn mit margin.
 
Ich habe das ganze nun so gemacht:

HTML-Datei:

<div>
<a href="themen.html" id="homelink"><div id="homelink"></div>
</div>


CSS-Datei:

#homelink{
width: 590px;
height: 100px;
margin-left: 10px;
margin-top: 10px;

}



Es funktioniert auch!


UPDATE:
Aber nicht einwandfrei :(
Das Problem ist, dass nicht der angegebene Bereich, sondern alles nun anklicken lässt!


Hier mal der Quellcode:

HTML-Datei:

-----------------------

<!DOCTYPE html>
<html>

<head>
<title>Testseite</title>

<meta charset="UTF-8">
<meta name="description" content="">
<meta name="author" content="">
<meta name="keywords" content="">

<link href="style.css" type="text/css" rel="stylesheet">
<link href="favicon.ico" type="image/x-icon" rel="shortcut icon">
</head>

<body>

<div>
<a href="themen.html" id="homelink"><div id="homelink"></div>
</div>

<div id="hintergrundblack">
</div>

<div id="textpage">
</div>

</body>
</html>


---------------
CSS-Datei:

---------------

body{
width: 1010px;
margin: 0 auto;
backgrond-color: black;
}

#homelink{
width: 590px;
height: 100px;
margin-left: 10px;
margin-top: 10px;
}

#hintergrundblack{
background-color: black;
background-image: url(images/background.png);
width:1024px;
height:800px;
}

#textpage{
background-color: #902121;
width:1024px;
height:200px;
}




-----
ENDE!
-----


Was ist der Fehler? Ich habe schon die Div-Elemente in der HTML-Datei "umgetauscht", dann verändert sich das Problem aber nur, d. h., dass ich dann z.b. nur den #textpage block anklicken kann, etc.


Danke für eure Hilfe und regt euch bitte nicht wieder auf, dass der Code Müll ist! ;)


L.G:



hannover96xd










EDIT:

ich habe das ganze mal hochgeladen!


http://multicultipage.funpic.de/
 
Zuletzt bearbeitet:
Du hast <a> nicht geschlossen.

Muchísimas Gracias senior!


EDIT:
Mal eine Frage am Rand, ich möchte dafür kein extra Thread aufmachen, wenn ich die Schriftart von einem Text z.b. auf "Andalus" ändere, die person, die gerade die Website anguckt, diese Schriftart aber nicht installiert hat, sieht er sie trotzdem, wie ich? Oder muss ich die Schriftart uns Haubt-Verzeichniss legen?
 
Wenn Du das Recht an der Schriftart hast um diese im Web verwenden zu dürfen, kannst Du die Schriftart-Datei auf deinem Webspace bereitstellen und per font-face im CSS einbinden. Wenn Du das Recht dazu nicht hast, darfst Du das auch nicht machen.
 
Wenn Du das Recht an der Schriftart hast um diese im Web verwenden zu dürfen, kannst Du die Schriftart-Datei auf deinem Webspace bereitstellen und per font-face im CSS einbinden. Wenn Du das Recht dazu nicht hast, darfst Du das auch nicht machen.

Dann nehmen wir mal an, dass ich die Schriftart: Arial nutzen würde, der Betrachter meiner Website aber einen Apple Computer hat und aus welchem Grund auch immer Arial nicht installiert hat.
Kann ich dann in CSS mit diesem Code:...

body {font:normal 1.1em/1.2em Geneva, Arial, Helvetica, sans-serif;}

...bestimmen, was als alternativ Schriftart benutzt werden soll?
 
Dann nehmen wir mal an, dass ich die Schriftart: Arial nutzen würde, der Betrachter meiner Website aber einen Apple Computer hat und aus welchem Grund auch immer Arial nicht installiert hat.
Kann ich dann in CSS mit diesem Code:...

body {font:normal 1.1em/1.2em Geneva, Arial, Helvetica, sans-serif;}

...bestimmen, was als alternativ Schriftart benutzt werden soll?

Ja.
 
Zurück
Oben