Sujet Précédent Sujet Suivant

Code HTML

Fermé
manbo49 Messages postés 65 Date d'inscription samedi 24 février 2007 Statut Membre Dernière intervention 19 mai 2017 - 17 août 2008 à 01:48
 garf - 17 août 2008 à 18:38
Bonjour,
ou plutot bonsoir !! :)

Je débute actuellement dans le HTML et j'essaie de rendre mon myspace music plus attrayant...
voici l'adresse : www.myspace.com/manbo49

Lorsque l'on ouvre le myspace on tombe sur une banniere avec une photo et marqué "manu".
Cette image est cliquable et voici le lien que j'ai rentré pour l'avoir :

<style>

body { margin-top: 1000px; }

.maclasse{
position: absolute;
top : 0;
width: 750px;
text-align: center;
margin-top: 15px;
margin-left: -364px;
left: 47%;
}

</style>

<div class="maclasse">
<a href="http://www.msplinks.com/MDFodHRwOi8vbWFuYm80OS5ibG9nc3BvdC5jb20="><img src="http://i509.photobucket.com/albums/s338/manbo49/CONCERTROCHEFORT-2.jpg" alt='CLIQUEZ ICI' border=0></a>
</div>


Pour l'instant, comme je ne sais pas faire ce que je vais vous demandé !! j'ai orienté le lien vers mon autre blog... mais j'aimerais que cette image cliquable oriente les gens sur la meme page (mon myspace) mais plus bas... car en fait comme c'est une banniere placé tout en haut, cela fais un peu page de présentation mais les gens ne voient pas forcément qu'en scrollant plus bas, on voit le reste...

Donc j'espere mettre bien exprimé, je voudrais que l'image cliquable me renvoie sur la meme page mais plus bas...

MERCI D'AVANCE !!

cordialement,

MANU
A voir également:

8 réponses

Réponse 1 / 8
Sinistrus
17 août 2008 à 02:01
Pour aller sur le lieu où tu souhaite être sur la même page mais tout en bas, voici le code que j'utilise :

<a href="#1"><img src="Images.png" width="13" height="13" border="0">Texte</a>
En cliquant sur ce lien, je me rend 10 mètres en bas sur ce code :

<a name="1" id="1"></a>

Remplace le chiffre 1 que tu vois par ce que tu veux, 2 ou x1 ou lien1, lien2, lien3

Pour un exemple simple, met dans une page vide ce bout de code :

<a href="#1"><img src="Images.png" width="13" height="13" border="0">Texte</a>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<a name="1" id="1"></a> Texte

Et pour remonter au tout début, voici le code à mettre derrière une image :
<a href="#top"><img src="Haut.png" width="16" height="16" border="0"></a>

Sans pour le moindre oublier que le haut de ta page à ce code à l'emplacement d'où tu veux débuter :
<a name="top" id="top"></a>

C'est tout ^^
0
Réponse 2 / 8
manbo49 Messages postés 65 Date d'inscription samedi 24 février 2007 Statut Membre Dernière intervention 19 mai 2017 1
17 août 2008 à 16:28
BOn alors, je vous remercie vraiment pour votre aide !!
Mais étant vraiment débutant en HTML, j'ai bcp de mal a arriver a ce que je veux !
En fait, j'ai bien mis le lien de ma page myspace sur l'image cliquable (tout a la fin) et cela fonctionne, ca me renvoit bien sur la meme page mais au meme endroit (en haut de la page...)
J'ai cru comprendre qu'apres "monlien" dans ce code qui rend cliquable l'image, je pouvais rajouter juste apres "target=#ancre" pour qu'il m'envoit sur la page et sur cette ancre...
Seulement même si j'ai compris qu'une ancre s''ecrit : <A HREF="#***">< /A> je sais vraiment pas ou la placer dans tout ce code HTML...
POurriez vous donc m'indiquer ou mettre cette ancre, pour qu'a la fin je mette un lien vers cette ancre, et que l'image cliquable me renvoit vers cet endroit de la page...
Ou tout simplement l'ajouter au code HTML que je vous mets ci dessus et me le renvoyer...
MErci d'avance.


Je me permets donc de vous poster le code HTML complet de ma page :

<style>
body {
font-size: 1px; line-height: 1px; font-family: Verdana, Arial, sans-serif;
background-color:e5e5e5;
background-image:url('http://i509.photobucket.com/albums/s338/manbo49/Onde5-1.jpg');
background-attachment: fixed;
background-position:center center;
background-repeat:no-repeat;
margin-top:0px;
}
.cool {
position: absolute;
left:0px;
top:0px;
width:156px;
height:154px;
z-index:8;
}
table.navigationBar {
position:relative;
z-index:9;
}
p {margin: 0px 0px 1em 0px; font-family: Verdana, sans-serif !important}
a, a:link, a:visited {color:F35485; text-decoration: none;}
a:hover {color:76996E; text-decoration: none}
img {border: none}
br {line-height: 10px;}
br + br
{
line-height:0;
}
u {text-decoration: none; }
table table table br { line-height:15px; }
* html table table table.latestBlogEntry br { line-height:0; }
.friendSpace br { line-height:0; }
form {border-width:0px;background-color:none;}
input {background-color:transparent !important}
body>div {margin-left: 10px;}
table {border-collapse:separate;}
table, tr, td, table table, table table td {border-width:0px; background-color: transparent;}
table table table td {background-color:transparent;margin:0px;padding:0; vertical-align:top ! important;}
* html table table table td {padding: 0 12px 15px 12px;}
table table table table {border-width:0px; background-color: transparent; margin:0px; padding:0px; background-image: none;}
table table table table table{ border-color:ffffff;}
table table table table td {padding:3px 0;margin:0px; }
table table table table table td { padding:0 2px 0 0;}
table table table {
margin:0px;
max-width: 453px;
width: 100% !important;
padding: 0 12px 14px 13px;
}
* html table table table { padding:0;}
body td table, body div table {margin-top: 0;}
font {color:386093;font-size:10px}
a font:hover {color:000000}
a.navbar:link, a.navbar:visited {color:FFFFFF}
a.navbar:hover {color:CCCCCC}
table tr td table tr td font {display: inline;}
table tr td table a.navbar {font-size: 10px;}
.text {color:000000;font-size:18px}
a.text:link, a.text:visited {color:FFFFFF}
a.text:hover {color:CCCCCC}
.contactTable {width: auto !important;}
* html .contactTable, *html .userProfileURL {width: 294px !important;}
.contactTable td {padding: 0px; margin: 0px; text-align: center; }
.contactTable span.whitetext12 { left: 0;}
* html .contactTable .whitetext12 {margin-left: 25px;}
.contactTable td table {
height:150px;
background-color: transparent;
background-position: center;
background-repeat: no-repeat;
}
* html .contactTable td table {
background-position:center center;
}
.contactTable a {padding: 0px; margin: 0px 5px 1px 0px; display: block; background-color: transparent; }
.contactTable a { height: 30px; width: 134px;}
.contactTable img { display:none; visibility:hidden;}
.contactTable a img {
border: 0px;
display: block;
visibility: visible;
}
.contactTable a img { width:120px; margin-top:6px; margin-left:8px;}
.nametext, .whitetext12, .orangetext15, .btext {
margin: 14px 0px 4px 0px;
width:auto;
display: block;
}
* html .nametext, * html .whitetext12, * html table.userProfileURL strong { width:267px; }
.orangetext15, .btext {
width:auto;
}
table table table table .orangetext15 { margin-bottom:4px;}
* html .orangetext15, * html .btext { width:390px;}
table tr td table tr td table tr td div strong {display: block; width: 270px;}
.whitetext12 { margin-top:0;}
.blacktext12 { display: block; margin-bottom:0px !important;}
.NOTES { content:"view all of your friend's link"; }
a.redlink:link {display: block; border-width: 3px 0px 0px 0px; padding-top: 3px;}
a.redlink:active, a.redlink:visited, a.redlink:link { display:inline; }
.NOTES { content:"firefox hack to make tables not to have a huge gap"; }
td.text {text-align:left;}
table table tr td {
line-height:1.4em;
}
table.userProfileURL strong { margin-top:-5px; margin-right:8px !important; }
table.userProfileURL { text-align:center;}
table.userProfileURL table {margin-top:-7px; margin-right:-5px;}
table table table.userProfileURL {padding-bottom:0;}
*html table table table.userProfileURL td {padding-bottom: 0;}
table.userProfileDetail .whitetext12, table.contactTable .whitetext12{ margin-top:3px;}
table table table.blurbs span.orangetext15, table table table.friendSpace .orangetext15 { display:none; }
table table table.blurbs table {margin-top:-18px;}
table table table.blurbs table table { margin:0; width:auto !important; padding:0;}
table table table.blurbs table span.orangetext15 { display:block; margin-bottom:0px;}
table table table.extendedNetwork { padding:0; }
table table table.extendedNetwork td { height:75px; padding:0;}
table table table.contactTable { padding:0;}
table table table.contactTable span.whitetext12{ display:none; }.contactTable .text {font-size:1px !important;}
table table table.contactTable td.text {height:0px !important}
.a {fix extended network border}
table table td.text table { border-collapse:collapse; }
td.text table.blurbs,
td.text table.latestBlogEntry,
td.text table.friendSpace,
td.text table.friendsComments,
table table td.text table table,
table.friendSpace td.text table,
table.friendsComments td.text table { border-collapse:separate; margin-top:0px; }
.a { ie fix }
* html table table td.text table td { padding:0;}
* html table table td.text table td table td { padding:0 !important;}
* html td.text table.blurbs td,
* html td.text table.latestBlogEntry td,
* html td.text table.friendSpace td,
* html td.text table.friendsComments td,
* html table.friendSpace td.text table td,
* html table.friendsComments td.text table td {
padding: 0 12px 15px 12px;
}
.r{}
body {
background-color:000000 !important;
}
table table table {
border-width: 1;
border-style: solid;
border-color: FFFFFF;
background-color:000000;
background-image:url('http://i509.photobucket.com/albums/s338/manbo49/489.jpg');
background-position:top left;
background-repeat: repeat-x;
filter:alpha(opacity=84.88372093023255);
-moz-opacity:0.8488372093023255;
opacity:0.8488372093023255;
-khtml-opacity:0.8488372093023255;
}
table table table table {filter:none !important; opacity:1 !important; }
.NOTES { contact table if necessary }
.contactTable {
}
.contactTable td table {
background-image: url('http://www.coolchaser.com/images/city_contact.gif');
}
.contactTable a img, .contactTable img {
visibility: hidden;
}
.NOTES { Text Style }
body, table table tr td, table table div, li, p, .redtext, .blacktext10, .text, a.text:link, a.text:visited,
a.searchlinksmall, a.searchlinksmall:link, a.searchlinksmall:visited,
.lightbluetext8, a, a:link, a:visited, a.redlink:link, div, font, a.navbar:link, a.navbar:visited
{
color:FFFFFF;
font-size:11;
}
a.searchlinksmall, a.searchlinksmall:link, a.searchlinksmall:visited { font-weight:normal;}
.NOTES { header colors and fonts }
.nametext, .whitetext12, .orangetext15, .btext, .redbtext, .blacktext12, table.userProfileURL strong {
margin: 14px 0px 4px 0px;
color:FFFFFF;
font-size:20;
font-family:comic sans MS, monospace;;
font-weight:bold;
}
.whitetext12 { margin-top:0; }
.NOTES { network graphic if necessary }
.a {fix extended network border}
table table td.text table {
}
td.text table.blurbs,
td.text table.latestBlogEntry,
td.text table.friendSpace,
td.text table.friendsComments,
table.friendSpace,
table.friendsComments
{
background-color:000000;
background-image:url('http://i509.photobucket.com/albums/s338/manbo49/489.jpg');
background-position:top left;
background-position:top left;
background-repeat:repeat;
background-repeat:repeat-x;
filter:alpha(opacity=84.88372093023255);
-moz-opacity:0.8488372093023255;
opacity:0.8488372093023255;
-khtml-opacity:0.8488372093023255;
}
table table td.text table table,
table.friendSpace td.text table,
table.friendsComments td.text table {
background:transparent;
}
span.blacktext12 {
padding-top: 30;
}
.blacktext12 { text-align:center; margin-top:0px;}
.nametext, .whitetext12, .orangetext15, .btext, table.userProfileURL strong {
background-color:transparent;
padding-top: 0;
padding-right:0;
padding-bottom:;
padding-left:0;
padding-left: 0;
border-style: none;
}
.nametext {
background-color:transparent;
}
.NOTES { details heading color }
.lightbluetext8 {
color:000000;
font-size:11;
font-family:Times NR, monospace;;
font-weight:normal;
}
.NOTES { Link Style }
a, a:link, a:visited, a.redlink:link, a.redlink:visited, a.navbar:link, a.navbar:visited, a.text:link, a.text:visited, a.text:hover {
color:FFFFFF;
font-size:11;
font-weight:normal;
text-decoration:underline;
}
a.navbar:link, a.navbar:visited, a.text:link, a.text:visited, a.text:hover {
}
a:hover, a.redlink:hover, a.navbar:hover, a.text:hover {
color:0000FF;
font-size:11;
background-color:009999;
text-decoration:underline;
}
a.navbar:hover, a.text:hover {
}
.NOTES { content:'make font smaller for friends comments box';}
a.navbar:link, a.navbar:visited, a.navbar:hover, a.text:link, a.text:visited, a.text:hover { font-weight:normal; font-size:9px;}
*html table table table { height: .01%; }
.NOTES { international sites have different settings and screws up the bann }
body div table td div {
margin-top:2px !important;
}
.cc_banner {
filter:alpha(opacity=84.88372093023255);
-moz-opacity:0.8488372093023255;
opacity:0.8488372093023255;
-khtml-opacity:0.8488372093023255;
width:751px;
margin-left:-365px;
left:50%;
position:absolute;
top:160px;
}
* html .cc_banner {
width:751px;
margin-left:-365px;
}
body table {
}
* html body table {
}
body td table, body div table {
margin-top: 0;
}
</style>
<style>
body {
background-position:center center !important;
}
</style>
</div>

<style>

body { margin-top: 1000px; }

.maclasse{
position: absolute;
top: 0;
width: 750px;
text-align: center;
margin-top: 15px;
margin-left: -364px;
left: 47%;
}

</style>

<div class="maclasse">
<a href="https://myspace.com/manbo49"><img src="http://i509.photobucket.com/albums/s338/manbo49/CONCERTROCHEFORT-2.jpg" alt='monalt' border=0></a>
</div>
0
Réponse 3 / 8
garf
17 août 2008 à 18:38
en fait il utiliser les ancres. ce qui correspond au code donné par les autres


le lien cliquable
<a href="mapage.htm#debut"><img src="monimage"></a>


la destination que l'on plaçe où l'on veut arriver :
<a name="debut"></a>
0
Réponse 4 / 8
manbo49 Messages postés 65 Date d'inscription samedi 24 février 2007 Statut Membre Dernière intervention 19 mai 2017 1
17 août 2008 à 02:04
oki !
mais ou dois-je mettre le code que tu m'as donné pour aller en bas dans celui que je t'ai donné ?
ou dois-je l'intégrer dans l'autre koi...??

Merci encore
-1

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 8
manbo49 Messages postés 65 Date d'inscription samedi 24 février 2007 Statut Membre Dernière intervention 19 mai 2017 1
17 août 2008 à 03:18
En fait ce code html mene bien a mon image cliquable et me renvoit vers le lien que je décide:

<a href="MON LIEN"><img src="MON IMAGE" border=0></a>

En l'occurence, le lien que je mets est celui de la page qui affiche cette image, c'est a dire ma page myspace (la meme page...)

Mais ce que j'aimerais comprendre c'est que rajouter a "MON LIEN" pour qu'il renvoit a la page A L'ENDROIT DESIRE ?

Dois-je rajouter dans mon lien un code HTML pour qu'il sache ou m'envoyer sur la page qd je clique sur l'image ?
Dois-je mettre dans "MON LIEN", a la place de l'adresse de mon myspace, une référence a une balise que j'ai placé a un endroit ?

Si c'est la 2e solution, pourriez vous m'indiquez comment mettre ma balise et surtout ou la mettre dans l'enchevetrement incompréhnsible (pour moi) de codes HTML composant mon myspace ?

SI cela peut vous aider, je peux poster le lien HTML complet de mon MYSPACE...

Merci d'avances pour votre aide
-1
Réponse 6 / 8
manbo49 Messages postés 65 Date d'inscription samedi 24 février 2007 Statut Membre Dernière intervention 19 mai 2017 1
17 août 2008 à 03:18
up
-1
Réponse 7 / 8
manbo49 Messages postés 65 Date d'inscription samedi 24 février 2007 Statut Membre Dernière intervention 19 mai 2017 1
17 août 2008 à 14:26
up
-1
Réponse 8 / 8
nEm3sis Messages postés 710 Date d'inscription lundi 20 août 2007 Statut Membre Dernière intervention 9 avril 2012 113
17 août 2008 à 15:22
pour pouvoir aller a un endroit précis de la page il faut utiliser les ancres comme l'a dit la personne au dessus

a la place de 
<a href="MON LIEN"><img src="MON IMAGE" border=0></a>
il faut mettre 
<a href="MON LIEN#ANCRE1"><img src="MON IMAGE" border=0></a>


et dans la page MON LIEN tu doit avoir un élément HTML qui a l'attribut name="ANCRE1"



par exemple ceci
<span class="whitetext12" name="ANCRE1">Manu: Infos générales</span>
-1

Discussions similaires

code d'activation GTA 5 steam
ylyes59 -
David -

6 réponses
Code de renvoi d'appel : Ooredo, Mobilis...
midoou07 -
Camille -

13 réponses
Codes bateaux et avion GTA vice city Stories
matt3610 -
Diglo -

30 réponses
Espace en HTML
baissaoui -
baissaoui -

0 réponse