En utilisant CSS actuel et non CSS3, est-il possible de spécifier un style de bordure de type levé, car je voudrais mettre en valeur mon menu. Fondamentalement après une bordure qui a un bord arrondi, pas de coins arrondis.CSS Border Help
Merci.
Avec CSS 2.1 et antérieur vous pouvez utiliser double, rainure, rainure , encart ou début. J'ai mis en place un fichier de démonstration simple pour que vous puissiez jouer avec et tester les différents styles de bordure qui s'offrent à vous.
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Border Styles</title>
<style type="text/css" media="screen">
body { background: #999; }
div { background: #eee; float: left; margin: 10px; padding: 10px; height: 100px; width: 100px; }
.double { border: 4px double #ccc; }
.ridge { border: 4px ridge #ccc; }
.groove { border: 4px groove #ccc; }
.inset { border: 4px inset #ccc; }
.outset { border: 4px outset #ccc; }
</style>
</head>
<body>
<div class="double">double</div>
<div class="ridge">ridge</div>
<div class="groove">groove</div>
<div class="inset">inset</div>
<div class="outset">outset</div>
</body>
</html>
Vous ne pouvez pas créer un coin arrondi sans la propriété CSS-border-radius. Si vous voulez faire cela, vous devriez utiliser un script comme Modernizr pour fournir un support alternatif pour les navigateurs qui ne peuvent pas supporter CSS3.
«encart» et «départ» le feraient, mais ce ne serait pas le résultat * le plus joli *. : P +1 tho, pour la simplicité. – jolt
Non sans images. Et CSS3 pourrait être appelé actuel CSS, au moins en implémentation avec WebKit et dans une moindre mesure Gecko.
IE joue jusqu'à attraper rythme trop lent :)
Vous pouvez essayer de faire une bordure en relief en ayant quelques éléments enfants, tous avec une bordure et avec une nuance plus claire de la couleur que vous atteignez la bordure extérieure .
De plus, vous pouvez également créer des coins crénelés 1px avec des marges négatives et CSS. On peut aussi argumenter que vous pouvez faire des bordures arrondies sans border-radius, mais le HTML et CSS sont assez horribles (pensez à tous les éléments enfants avec des marges négatives, etc.)
IE9 vise à soutenir pleinement CSS2. Ils se sont vantés à ce sujet sur leur site web ... Sur leur site ils ont également noté que leurs concurrents travaillaient déjà sur CSS3 ... * Facepalm * ... Il est possible d'utiliser 'border-radius' mais il vaut mieux utiliser des tables ... parce que c'est au moins beaucoup plus facile de travailler avec ... – Warty
@ItzWarty êtes-vous en mesure de fournir un petit échantillon de la façon d'y parvenir en utilisant des tables - merci. – tonyf
Si vous pouviez fournir un exemple d'image, je pourrais peut-être mettre en place un exemple. – Warty
Quelque chose comme ... une ellipse peut-être? Comme le nœud central dans ce graphique? http://www.homeandlearn.co.uk/powerpoint/images/charts/7Slide6.gif – ZJR