xhtml/css (le carrer bleu tout pourrie)

22-07-2011 11:34:12

Bonjours alors voila je voudrais savoirs comment retirer le cadre bleu autours des image ?
(je croyer avoirs compris comment faire mais a ce que je vois non)

bref voila m'as page :

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
   <head>
       <title>Bienvenue sur mon site !</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <link rel="stylesheet" media="screen" type="text/css" title="Design" href="le lien vers la fichier css" />
   </head>
   <body>

<a href="page2.xhtml" title="lien"><img src="kk.gif"></img></a>
   </body>
</html>

est voila le fichier css :

Code:

a
{
   text-decoration: none; /* Les liens ne seront plus soulignés */
   color: none; /* Les liens seront en rouge au lieu de bleu */
   font-style: italic; /* Les liens seront en italique (pourquoi pas ?) */
}

Alors sa pour info c'est juste un truque écrit a la v'as vite histoire de résumer le tout,
je rentrer dans les d'étails est dans ce que j'ai déjà tenter a m'as prochaine connection.

22-07-2011 11:51:10

Arf c'est un truc que j'ai fait cette année la création de site, a première vue je vois pas ce qui cloche, soit ton image enregistrée à un cadre bleu et t'as pas fait gaffe, ou essaye peut être de la redimensionner , mais je me souviens pas de ce type de problème

22-07-2011 17:04:54

C'pas compliqué, quand on fait une image avec un lien, il y a toujours une bordure bleue qui apparaît autour de l'image. C'est un paramètre par défaut. Pour la retirer, il faut mettre ça :

Code:

<a href="ton url"><img src="url de ton image" border="0" /></a>

22-07-2011 19:06:12

[quote=Shirohime]C'pas compliqué, quand on fait une image avec un lien, il y a toujours une bordure bleue qui apparaît autour de l'image. C'est un paramètre par défaut. Pour la retirer, il faut mettre ça :

Code:

<a href="ton url"><img src="url de ton image" border="0" /></a>

[/quote]
Cool sa marche merci

Mais y'a pas moyens de faire un attribut class qui retirer automatiquement les bordure des image
ou faire un truque comme sa par exemple :

Code:

a img
{
border: 0; 
}

Ce qui ferrait que tout les balise [b]img[/b] qui ce trouve entre 2 balise [b]a[/b]
N'est pas de bordure ?

(je suis pas sûre de m'avoir bien expliquer x) mais bon...)

[quote=shadow5]Arf c'est un truc que j'ai fait cette année la création de site, a première vue je vois pas ce qui cloche, soit ton image enregistrée à un cadre bleu et t'as pas fait gaffe, ou essaye peut être de la redimensionner , mais je me souviens pas de ce type de problème[/quote]
Non y avez pas de cadre bleu autours de l'image x)
(si y en avez eu depuis le temps que je cherche, je te jure j'aurais sauter d'un pont xD)

Dernière modification par jss (22-07-2011 19:09:08)

22-07-2011 19:13:32

Ça serait ça :

Code:

a.img {
border: none !important;
}

ou (je n ai pas testé)

img:link {
border: none !important;
}

ou

img {
border: none !important;
}

Après, tu me diras si aucun ne fonctionne, mais normalement, le premier devrait faire. Sinon, c'est aussi à toi de développer le réflexe de mettre un border="0" sur toutes tes images, même si c'est un peu lourd. Utiliser alt="blabla" pour mettre un texte alternatif aussi et un target="_xxx" sur les <a> peut être utile aussi.

Dernière modification par Shirohime (22-07-2011 19:17:50)

22-07-2011 19:23:35

[quote=Shirohime]Ça serait ça :

Code:

a.img {
border: none !important;
}

ou (je n ai pas testé)

img:link {
border: none !important;
}

ou

img {
border: none !important;
}

Après, tu me diras si aucun ne fonctionne, mais normalement, le premier devrait faire. Sinon, c'est aussi à toi de développer le réflexe de mettre un border="0" sur toutes tes images, même si c'est un peu lourd. Utiliser alt="blabla" pour mettre un texte alternatif aussi et un target="_xxx" sur les <a> peut être utile aussi.[/quote]
Merci,

çà fonctionne les 2 premier ne marche pas mais le 3eme fonctionne

Code:

/*Celui-là*/

img
{
border: none !important;
}

22-07-2011 19:54:56

D'accord, je cherchais juste s'il y avait moyen de bloquer les bordures seulement sur les images avec des liens... Au passage, tu ne seras peut-être plus capable de mettre des bordures manuellement sur des images. Si c'est le cas, retire le !important, car il donne la priorité à la propriété CSS sur toutes les autres (peu importe le langage).

22-07-2011 20:58:52

[quote=Shirohime]D'accord, je cherchais juste s'il y avait moyen de bloquer les bordures seulement sur les images avec des liens... Au passage, tu ne seras peut-être plus capable de mettre des bordures manuellement sur des images. Si c'est le cas, retire le !important, car il donne la priorité à la propriété CSS sur toutes les autres (peu importe le langage).[/quote]
Oki mais avec cette méthode on peux toujours ajouter un cadre bleu (ou autres couleur)
Au moment du clic ?

22-07-2011 22:03:44

tu veux que quand tu cliques sur ton image il y aie un carré bleu au moment ou tu click ou après ?
Parce-que si c'est pendant, faudra que tu fasse avec du Javascript

[spoil]Les erreurs suivantes doivent être corrigées pour que le message puisse être envoyé :

Les messages doivent être argumentés, nous vous invitons à relire les règles. Pour le dialogue, le bar est à votre disposition.[/spoil]

22-07-2011 23:28:56

Quand j'ai fait du xhtml/css, j'ai eu ce problème une fois
j'ai juste fait une recherche google ...

22-07-2011 23:30:43

[quote=sasuke12_13]tu veux que quand tu cliques sur ton image il y aie un carré bleu au moment ou tu click ou après ?
Parce-que si c'est pendant, faudra que tu fasse avec du Javascript [/quote]
Pas besoin. On peut changer les couleurs de bordures au survol avec le CSS en ajoutant des attributs :hover ou :visited à des classes. Quant à celui qui correspond à l'effet que tu cites, c'est le :active.

Dernière modification par Shirohime (23-07-2011 00:08:26)

22-07-2011 23:45:23

Je sais tout sa, mais en js tu attribue ce que tu veux à l'image que tu veux et ce, sans faire 36 classes
PS: l'idée de mettre un carré bleu autour de l'image n'ayant pas encore été définitivement définie, attendons
Mais par contre, pour le coup, tu as raison, c'est plus simple (si il veut un carré de même couleur).
Le code serait donc:
*remplacer "x" par le nom de la classe*

Code:

x:hover{
border:3px black;
}

Si on désire un bordure de 3px noir

Dernière modification par sasuke12_13 (22-07-2011 23:48:29)

23-07-2011 00:48:10

[quote=Shirohime]D'accord, je cherchais juste s'il y avait moyen de bloquer les bordures seulement sur les images avec des liens... Au passage, tu ne seras peut-être plus capable de mettre des bordures manuellement sur des images. Si c'est le cas, retire le !important, car il donne la priorité à la propriété CSS sur toutes les autres (peu importe le langage).[/quote]
En faite je connais déjà le pseudo format [i]hover[/i]
(je suis pas sûre que ont les appelle comme sa x') enfin bref.)

Ce que je voulais dire dans mon poste précédent c'est :
Le bout de code css, que tu m'as donnez annule t'il les valeurs que j'aurais attribuer a hover ?

Dernière modification par jss (23-07-2011 00:49:02)

23-07-2011 02:26:10

Je ne vois pas de carré bleu quelqu'un pourrait m'orienter parce que je voudrais aider à résoudre le problème c'est gênant de feuilleter un topic sans laisser une trace ou une quelconque aide donc je poste mon message espérant qu'une personne me répondra j'engagerais tout mon possible pour y rémedier
Merci à tous

23-07-2011 04:27:44

[quote=Wagyu]Je ne vois pas de carré bleu quelqu'un pourrait m'orienter parce que je voudrais aider à résoudre le problème c'est gênant de feuilleter un topic sans laisser une trace ou une quelconque aide donc je poste mon message espérant qu'une personne me répondra j'engagerais tout mon possible pour y rémedier
Merci à tous[/quote]
Ben en gros, il voulait retirer le cadre bleu qui apparaît quand on fait un lien sur une image. C'est un 'par défaut' du codage HTML.

[quote=jss]Le bout de code css, que tu m'as donnez annule t'il les valeurs que j'aurais attribuer a hover ?[/quote]
Si tu as mis un hover dans ton CSS, toutes les caractéristiques que tu as mises dans le a normal ne seront pas réitérées. ^^

23-07-2011 10:01:47

[quote=Shirohime][quote=Wagyu]Je ne vois pas de carré bleu quelqu'un pourrait m'orienter parce que je voudrais aider à résoudre le problème c'est gênant de feuilleter un topic sans laisser une trace ou une quelconque aide donc je poste mon message espérant qu'une personne me répondra j'engagerais tout mon possible pour y rémedier
Merci à tous[/quote]
Ben en gros, il voulait retirer le cadre bleu qui apparaît quand on fait un lien sur une image. C'est un 'par défaut' du codage HTML.

[quote=jss]Le bout de code css, que tu m'as donnez annule t'il les valeurs que j'aurais attribuer a hover ?[/quote]
Si tu as mis un hover dans ton CSS, toutes les caractéristiques que tu as mises dans le a normal ne seront pas réitérées. ^^[/quote]
Ah bah je ne peux en aucun cas l'aider parce que je l'ai pas ce problème

25-07-2011 03:08:06

[quote=Shirohime][quote=Wagyu]Je ne vois pas de carré bleu quelqu'un pourrait m'orienter parce que je voudrais aider à résoudre le problème c'est gênant de feuilleter un topic sans laisser une trace ou une quelconque aide donc je poste mon message espérant qu'une personne me répondra j'engagerais tout mon possible pour y rémedier
Merci à tous[/quote]
Ben en gros, il voulait retirer le cadre bleu qui apparaît quand on fait un lien sur une image. C'est un 'par défaut' du codage HTML.

[quote=jss]Le bout de code css, que tu m'as donnez annule t'il les valeurs que j'aurais attribuer a hover ?[/quote]
Si tu as mis un hover dans ton CSS, toutes les caractéristiques que tu as mises dans le a normal ne seront pas réitérées. ^^[/quote]
Donc, ci je fait çà :

Code:

img
{
border: none;
}

Est que en suite je fait dans le même fichier [i]Css[/i] çà :

Code:

img:hover
{
color: red;
border: 3px;
}

L'image auras pas de cadre mais au moment ou m'as souris iras sur l'image un cadre rouge apparaitras ?

C'est tout bon 10/10 ? [img]http://tout-wlm.fr/images/icones/question.gif][/img]

25-07-2011 13:12:26

Normalement, sa devrait être sa, mais essaie et au pire, je te dirais en JS

[spoil]Les messages doivent être argumentés, nous vous invitons à relire les règles. Pour le dialogue, le bar est à votre disposition.[/spoil]

25-07-2011 15:00:04

Nan, ça ne fonctionnera pas. xD Dans un CSS, le color est utilisé pour définir la couleur d'un texte. Et pour qu'un border fonctionne, il te faut au moins deux attributs : la largeur et le type de bordure. Si tu veux rajouter la couleur de bordure, c'est dans la même ligne, comme ça :

Code:

img:hover {
border: 1px solid #FF0000;
}

solid : bordure continue
dotted : bordure de points
dashed : bordure de traits
double : bordure double continue (minimum 3px)

Il y en a d'autres, mais ce sont les plus pratiques et une petite recherche te suffira pour trouver les autres. (:

Dernière modification par Shirohime (25-07-2011 15:01:04)

30-07-2011 03:52:21

[quote=Shirohime]Nan, ça ne fonctionnera pas. xD Dans un CSS, le color est utilisé pour définir la couleur d'un texte. Et pour qu'un border fonctionne, il te faut au moins deux attributs : la largeur et le type de bordure. Si tu veux rajouter la couleur de bordure, c'est dans la même ligne, comme ça :

Code:

img:hover {
border: 1px solid #FF0000;
}

solid : bordure continue
dotted : bordure de points
dashed : bordure de traits
double : bordure double continue (minimum 3px)

Il y en a d'autres, mais ce sont les plus pratiques et une petite recherche te suffira pour trouver les autres. (:[/quote]
oosp oui dsl j'ai du zapez la megapropriété border sur le moment dsl
enfin bon problème resolut maintenant juste une petite questions

Je suis entrein de faire un site teste pour voire
comment sa marche est je me suis apersus que cest barbent de devoirs
changer les liens de chaque page :-s

par exemple pour auceuil je mais tout les lien aprer je c/c aceuil j'efface tout ce quille y a dans le corp de la
page, est je creer une page avec in formulaire par exemple bhein la vue que jai changer de dossier il faut que je me re tape tout les lien u_u...

enfin bref ci japprend le php je pourrais contourner sa ?
par exemple le php offre til la posibilité de creer des balise lien ? :-\

je sait que mon poste doit faire mal au yeux tellement y a de fautes (vraiment dsl)
mais bon je poste sur mon tel c'est galère >__< dsl

31-07-2011 16:30:10

Si t'utilise du php, tu peux faire sa, mais si ta bdd crash, tout ton site va crasher avec ...

M'enfin, n'importe quel site avec une bdd est dans ce cas mais bon (Très long a faire avec une bdd si t'as déjàfait tes pages )

31-07-2011 21:42:28

jss > Salut!

Le PHP est un langage coté serveur, il permet d'intéragir lorsque le client soumet une requête et génére dynamiquement le contenu à renvoyer. C'est à dire que le PHP n'est pas là pour remplacer le HTMl, il le génère. Par exemple pour ton problème de lien, une solution en PHP peut être avantageuse et il y a toujours plusieurs moyens pour arriver à son but.

Tu peux par exemple créer ta page comme ça:

(pour ton menu tu crée le document suivant: menu.php

Code:

<a href="#">Lien 1</a><br>
<a href="#">Lien 2</a><br>
<a href="#">Lien 3</a><br>
<a href="#">Lien 4</a><br>
<a href="#">Lien 5</a><br>

Et dans ta page:

Code:

<?php
#Code à insérer partout où tu veux voir apparaître ton menu
include 'menu.php';
?>

C'est pas plus compliqué que ça, c'est à dire que si tu inclues ton fichier menu.php dans les pages index.php, contact.php, faq.php (par exemple), tu n'as qu'à modifier menu.php pour que les changements soient effectués sur ces pages.

C'est pour ça qu'on dit que le PHP est un langage dynamique.

01-08-2011 13:42:07

[quote=tortue genial]jss > Salut!

Le PHP est un langage coté serveur, il permet d'intéragir lorsque le client soumet une requête et génére dynamiquement le contenu à renvoyer. C'est à dire que le PHP n'est pas là pour remplacer le HTMl, il le génère. Par exemple pour ton problème de lien, une solution en PHP peut être avantageuse et il y a toujours plusieurs moyens pour arriver à son but.

Tu peux par exemple créer ta page comme ça:

(pour ton menu tu crée le document suivant: menu.php

Code:

<a href="#">Lien 1</a><br>
<a href="#">Lien 2</a><br>
<a href="#">Lien 3</a><br>
<a href="#">Lien 4</a><br>
<a href="#">Lien 5</a><br>

Et dans ta page:

Code:

<?php
#Code à insérer partout où tu veux voir apparaître ton menu
include 'menu.php';
?>

C'est pas plus compliqué que ça, c'est à dire que si tu inclues ton fichier menu.php dans les pages index.php, contact.php, faq.php (par exemple), tu n'as qu'à modifier menu.php pour que les changements soient effectués sur ces pages.

C'est pour ça qu'on dit que le PHP est un langage dynamique.[/quote]
ê_e... (notes que je connais que le (x)html/css est encore je débute)

Alors ce que tu me dit me laisse perplexe...[img]http://www.siteduzero.com/Templates/images/smilies/blink.gif[/img]
les balise php ca ce place comme un block dans la page ?
(en faite je connais pas du tout le php pour l'instant)

01-08-2011 18:43:36

Déjà, il faut que tu utilise un serveur pour utiliser du php ...
Tu peux le tester en local avec "easyphp", c'est mieux de faire sa avant d'envoyer ton site si tu vois ce que je veux dire.

Pour utilisé du php, il faut que tu places les balises :

<?php

#toncode

?>

Après, on peut pas t'apprendre à utilisé le php, si tu veux, quand je rentre de vacances, je te passes des bout de code que j'ai ou même demain quand mon dd externe sera réparer

03-08-2011 21:51:42

[quote=jss]ê_e... (notes que je connais que le (x)html/css est encore je débute)

Alors ce que tu me dit me laisse perplexe...[url]http://www.siteduzero.com/Templates/images/smilies/blink.gif[/url]
les balise php ca ce place comme un block dans la page ?
(en faite je connais pas du tout le php pour l'instant)[/quote]
Oui excuse moi, en fait, ça semble bizarre comme langage un peu le PHP (à la première approche) quand on a fait que du HTML et du CSS mais on se rend bien compte que tout les sites qu'on fréquente utilisent PHP, mais saches qu'il y a aussi d'autres langages pour le web qui sont tout aussi intéressant (Python avec le framework Django, Ruby avec RubyOnRails, ColdFusion (édité par Adobe) mais pour trouver un hébergeur compatible avec ceux-ci... Bonne chance!)

Bref, le PHP est un langage dynamique qui permet énormément de chose (écriture de fichier, gestion des DOM pour le XML, création d'image avec les librairies GD etc) et est composé de fonctions et de commandes natives.

Dans mon exemple, j'utilise la commande include, qui permet d'inclure un fichier à l'endroit où j'utilise la commande. Je demande donc d'inclure le fichier php [b]menu.php[/b] qui contient le menu. Si il contient du code PHP, ce code sera exécuté.

Et oui, on peut placer du PHP à l'intérieur d'un fichier HTML avec les balises <?php & ?>, car à la vue de ces balises, le serveur sait qu'il va lire du code PHP. Cependant, c'est aussi nécéssaire pour les fichiers PHP hein.

Heu, j'ai pas été trés clair je sais mais tu trouveras pleins de site sur PHP, et ne te contente pas seulement du site du zéro, cherche des tutos sur internet, et surtout, lit la documentation officielle qui est très intéressante et surtout à jour!

Si tu as des questions, n'hésites pas

Forums » xhtml/css (le carrer bleu tout pourrie):