English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
column-rule-style CSS属性设置多列布局中在列之间绘制的规则的样式。
下表为此属性的用法说明和版本历史记录，以及该属性在javascript脚本中的使用语法。
| 默认值： | none |
|---|---|
| 适用于： | 多列元素 |
| 继承： | 没有 |
| 可动画制作： | 否。请参见 动画属性。 |
| 版本： | CSS3的新功能 |
| JavaScript语法： | object.style.columnRuleStyle="dotted" |
该属性的语法如下：
column-rule-style: none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset | initial | inherit
Les exemples suivants montrent comment utiliser column-rule-Attribut style.
p {
/* Chrome, Safari, Opera */
-webkit-column-count: 3;
-webkit-column-gap: 100px;
-webkit-column-rule-color: red;
-webkit-column-rule-width: 2px;
-webkit-column-rule-style: solid;
/* Firefox */
-moz-column-count: 3;
-moz-column-gap: 100px;
-moz-column-rule-color: red;
-moz-column-rule-width: 2px;
-moz-column-rule-style: solid;
column-count: 3;
column-gap: 100px;
column-rule-color: red;
column-rule-width: 2px;
column-rule-style: solid;
}Vérifiez et voyez‹/›Le tableau suivant décrit les valeurs de cette propriété.
| Valeur | Description |
|---|---|
| none | Ne montre aucune règle. |
| hidden | Ne montre aucune règle. Équivalent à |
| dotted | Affiche les règles sous forme d'une série de points. |
| dashed | Affiche les règles sous forme d'une série de courts segments, c'est-à-dire des tirets. |
| solid | Affiche les règles sous forme d'une ligne continue. |
| double | Affiche les règles sous forme de deux lignes parallèles, avec un certain espacement entre elles. La somme des deux lignes et de l'espacement entre elles est égale àcolumn-rule-widthvaleur de l'attribut. |
| groove | Affiche les règles gravées dans la page. Elle donne une impression de3L'impression de D, généralement réalisée par la création d'ombres de deux couleurs, qui sont pluscolumn-rule-colorde la couleur un peu plus claire et plus sombre. |
| ridge | Affiche des règles opposées à3L'impression de D, les règles semblent sortir de la page. |
| inset | Affiche les mêmes règles que |
| outset | Affiche les mêmes règles que |
| initial | Définissez cette propriété à sa valeur par défaut. |
| inherit | Si spécifié, l'élément lié utilise la valeur column de son élément parent-rule-valeur de l'attribut style. |
Attention :ce column-rule-L'attribut style utilise principalement les valeurs définiesborder-style，mais l'interprétation de ces valeurs est différente deModèle de bordure repliée identique。
column-rule-La compatibilité du navigateur de l'attribut style, les numéros dans le tableau suivant représentent la version minimale du navigateur prenant en charge cette propriété ; tous les navigateurs populaires prennent en charge cette propriété.
|
Veuillez consulter les tutoriels suivants :CSS3Mise en page en colonnes multiples。
Propriétés associées :column-width，column-fill，column-gap，column-rule，column-rule-width，column-rule-color，column-span，column-count，columns。