|
|
|
Bienvenue sur le Wiki d'Univers-PC !
Afin de vous familiariser avec le wiki je vous invite à lire les Tutoriaux du wiki. Rapporter une mise à jour de logiciel Border-style-width-colorDe Wiki-PC.
ExempleCode XHTML
<!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>Border-style-width-color</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" media="screen" type="text/css" title="border-style-width-color" href="border-style-width-color.css" />
</head>
<body>
<h1>Exemples XHTML / CSS</h1>
<p>Bonjour,<br />
Ceci est un exemple du site <a href="http://wikipc.fr">Wiki-PC.fr</a> de la proprété CSS : <a href="http://wikipc.eu/index.php5?title=border-style-width-color">border-style-width-color</a></p>
<h1>Bordures</h1>
<table>
<caption>Les Distributions Debian</caption>
<thead>
<tr>
<td>Nom</td>
<td>Description</td>
<td>Date de sortie</td>
</tr>
</thead>
<tfoot>
<tr>
<td colspan="3">Une distribution Open Source !!!</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>Debian 4.0 Etch</td>
<td>Version Stable</td>
<td>8 avril 2007</td>
</tr>
<tr>
<td>Debian 5.0 Lenny</td>
<td>Version en Test</td>
<td>Prévue pour fin 2008</td>
</tr>
<tr>
<td>Debian Squeeze</td>
<td>Prochaine Version en Test</td>
<td>Aucune Date</td>
</tr>
<tr>
<td>Debian Sid</td>
<td>Version Instable</td>
<td>Toujours en évolution</td>
</tr>
</tbody>
</table>
<p class="bordure-texte">
Texte entouré par une bordure
</p>
<p>
<img class="bordure-image" src="http://wiki-pc.fr/skins/monobook/wiki.png" alt="" />
</p>
</body>
</html>
Code CSS
body
{
background: url("http://wiki-pc.fr/skins/monobook/wiki.png") #FFFFDE fixed no-repeat bottom right;
}
h1
{
background-color: #E1E5FF;
}
td
{
border-width: 2px;
border-style: solid;
border-color: blue;
}
.bordure-texte
{
border-width: 5px;
border-style: groove;
border-color: red;
}
.bordure-image
{
border-width: 1px;
border-style: dotted;
border-color: green;
padding: 10px;
}
Ce qui affichera
FonctionVous ne pouvez pas ajouter les propriétés border-width, border-color ou border-style seules. border-width :Permet d'ajouter l'épaisseur de la bordure. Il faut mettre l'épaisseur de la bordure en px. border-style :Permet de donner un style à la bordure. solid : ligne simple de la bordure. double : ligne en double. dashed : ligne en tirets. dotted : ligne en pointillés. inset : donne un effet 3D rentrant dans la page. outset : donne un effet 3D sortant dans la page. groove : Un peu comme inset, mais donne un effet de gravure dans la page. ridge : Un peu comme outset, mais donne un effet de gravure dans la page. none : tout simplement aucune bordure... hidden : Cache la bordure, un peu comme none, mais l'espace donné dans border-width est pris en compte. border-color :Permet d'ajouter une couleur à la bordure. voir color Si vous voulez coller les bordures du tableau voir : border-collapse |
