Rechercher : dans
Par :

[CSS] Bordure ...

Dernière réponse le 4 jun 2007 à 17:40:53 krabs, le 17 avr 2007 à 16:18:35 
 Signaler ce message aux modérateurs

Bonjour,
Je cherche depuis pas mal de temps a faire un div de hauteur et de largeur donné dont les angles sont arrondis et la bordure de type "inset" sans utiliser d'image.
Si quelqun aurait une idéé..
Merci

Configuration: Windows XP
Firefox 2.0.0.3

Meilleures réponses pour « [CSS] Bordure ... » dans :
Enlever la bordure sur une image dans un lien en HTML/CSS VoirVous avez fait une image cliquable en mettant une balise IMG au sein d'un lien et le navigateur vous affiche un cadre ou plus exactement une bordure autour de l'image. Il existe deux façons de supprimer cette bordure...
Enlever le soulignement sous les liens en HTML/CSS VoirPar défaut, les liens hypertextes en HTML sont soulignés, un trait de la couleur du lien apparaît en dessous du texte. Il est possible de supprimer ce soulignement à l'aide de la propriété CSS text-decoration:none : Grâce au CSS Grâce au CSS via...
Les CSS pour présenter vos images VoirPour présenter agréablement vos images, vous pouvez intégrer quelques codes supplémentaires dans votre CSS et vous en servir à bon escient. Elles sont bien sur modulables en fonction de la charte graphique de votre site. Utilisation Mettez les codes...
Télécharger BorderMaker VoirAjoutez un cadre photo à une image virtuel n'est pas évident. Alors pour faire simple, des programmes sont spécialisés dans cette tâche bien précise. Bordermaker est un outil permettant d'ajouter des bordures, des textes ou un effet de filigrane...
CSS - Les couleurs VoirLes couleurs Le standard CSS propose différentes façons de définir des couleurs : par un nom avec la notation hexadécimale avec la notation décimale Appel d'une couleur par son nom Le langage HTML définit des noms pour un nombre limité de...
Les classes de style (CSS) VoirLes classes et les ID Les classes Il peut s'avérer intéressant d'affecter des styles différents à des mêmes balises. Pour cela les spécifications CSS ont introduit le concept de classe. La définition des classes est aussi simple que celles des...
Tableau de bord VoirNotion de tableau de bord Un tableau de bord est une représentation graphique synthétique d'un ensemble d'indicateurs donnant à un responsable tous les éléments lui permettant de prendre visuellement et rapidement des décisions. Compte-tenu de sa...

1

xjl, le 17 avr 2007 à 16:25:57

Salut,

tu devrais jeter un oeil à cette discussion:
html css

Bonne chance ! ;-)

Répondre à xjl

2

s.spark, le 17 avr 2007 à 16:27:12

Salut,

Cette fonction n'existe pas. Toutefois elle existe de façon propriétaire, ainsi sous mozilla ca donne :

-moz-border-radius: 10px 10px 10px 10px;


Par exemple. Sous IE ca n'existe pas, piour khtml c'est avec un autre préfixe :
khtml-border-radius  10px 10px 10px 10px;



Bref rien de bien génial, ces balises ne sont pas standardisé. Peut être qu'avec CSS3 on aura "border-radius".
Ceux qui veulent savoir comment utiliser eMule Paradise contactez moi par email.

Répondre à s.spark

3

krabs, le 17 avr 2007 à 16:33:01
  • +1

Merci beaucoup,
Le probleme n'est pas les angles arrondis mais la bordure avec un effet d'ombre.
J'utilise pour les coins arrondis l'html suivant:

             <b class="rtop">
                 <b class="r1"></b>
                 <b class="r2"></b>
                 <b class="r3"></b>
                 <b class="r4"></b>
             </b>

<div id="content"></div>

             <b class="rbottom">
                 <b class="r4"></b>
                 <b class="r3"></b>
                 <b class="r2"></b>
                 <b class="r1"></b>
             </b>

avec ce code css:

b.rtop, b.rbottom{
     display:block;
}

b.rtop b, b.rbottom b{
     display:block;
     height: 1px;
     overflow: hidden; 
     background: #6A6458
}

b.r1{
     margin: 0 5px;
}

b.r2{
     margin: 0 3px;
}

b.r3{
     margin: 0 2px;
}

b.rtop b.r4, b.rbottom b.r4{
     margin: 0 1px;
     height: 2px;
}

Répondre à krabs

4

s.spark, le 17 avr 2007 à 22:16:07

C'est quoi toute ces balises b de partout ? Tu les as imbriqué °_°
Ceux qui veulent savoir comment utiliser eMule Paradise contactez moi par email.

Répondre à s.spark

5

krabs, le 18 avr 2007 à 16:56:55

Bonjour,
Oui j'ai tout trouver sur ce site:http://www.html.it/articoli/nifty/index.html
(il texpliquera sa mieux que moi)
sauf pour la bordure ...

Répondre à krabs

6

s.spark, le 18 avr 2007 à 17:58:54

A mon avis, et c'est que mon avis, c'est impossible de le faire avec cette méthode de coin arrondi.

Mais je pense qu'avec les balise propriétaire que je t'ai passé ça devrais être bon.

div {
-moz-border-radius: 10px 10px 10px 10px;
border: 3px inset #c0c0c0;
}

Ceux qui veulent savoir comment utiliser eMule Paradise contactez moi par email.

Répondre à s.spark

10

gryphus71, le 4 jun 2007 à 16:11:27

-moz-border-radius: 10px 10px 10px 10px;

mouai ...

un "-moz-border-radius: 10px;" suffirait ;)

Répondre à gryphus71

11

 s.spark, le 4 jun 2007 à 17:40:53

Je sais, la question n'est pas là.
Ceux qui veulent savoir comment utiliser eMule Paradise contactez moi par email.

Répondre à s.spark

7

Dalida, le 19 avr 2007 à 15:01:02
  • +1

Salut,

à mon avis, les angles [...] arrondis et la bordure de type "inset" et sans utiliser d'image, ça fait un élément de trop.
tu as bien le code pour la bordure en 'inset', il le fait tout seul, krabs t'as montré comment faire des arrondis mais je ne vois pas comment faire les deux à la fois d'autant plus que tu ne veux pas de bitmap...
[ Mathieu ]
savoir rester faignant, c'est progresser en informatique. enfin, j'essaie...

Répondre à Dalida

8

s.spark, le 20 avr 2007 à 00:33:04

Je maintien mot pour mot tout ce que je viens de dire et je n'ai pas parlé d'images. Le bitmap n'est pas le seul format d'image, d'ailleurs il n'est jamais utilisé sur des pages web, par contre le jpg, le gif et le png, eux le sont largement.
Ceux qui veulent savoir comment utiliser eMule Paradise contactez moi par email.

Répondre à s.spark

9

Dalida, le 20 avr 2007 à 17:03:24

Salut,

par bitmap je n'entendais pas le format bmp mais les images matricielles, quand à leur utilisation...
donc je te répète que coins arrondis et bordure sans image, pour moi c'est impossible raisonnablement. il y en a simplement un de trop.
[ Mathieu ]
savoir rester faignant, c'est progresser en informatique. enfin, j'essaie...

Répondre à Dalida