[分享]css中属性有几个值连接

CSS中许多属性都可以接受多个值的参数，这些值之间通过不同的符号连接。下面就来逐个介绍这些属性和它们的值连接符。 / 给某个元素同时设置上、右、下、左四个方向的边框样式 / border: 1px s...

CSS中许多属性都可以接受多个值的参数，这些值之间通过不同的符号连接。下面就来逐个介绍这些属性和它们的值连接符。

 /* 给某个元素同时设置上、右、下、左四个方向的边框样式 */
  border: 1px solid gray;

  /* 给某个元素的border-top-left-radius和border-bottom-right-radius属性分别设置水平和垂直圆角弯曲半径 */
  border-radius: 10px 5px;

  /* 给某个元素的box-shadow属性设置多个投影的偏移值、模糊半径、扩散半径和颜色 */
  box-shadow: -5px -5px 5px #888, 5px 5px 5px #ccc;

  /* 给某个元素同时设置不同方式的背景颜色和背景图片 */
  background: #fff url("bg.png") no-repeat center;

  /* 给某个元素的background-size属性分别设置宽度和高度 */
  background-size: 50% 100%; 

在上面的代码片段中，border属性的值连接符是空格，表示设置上、右、下、左四个方向的边框样式。border-radius属性的值连接符是斜杠/，表示设置水平和垂直圆角弯曲半径。box-shadow属性的值连接符是逗号，表示设置多个投影的偏移值、模糊半径、扩散半径和颜色。background属性的值连接符是空格，表示同时设置不同方式的背景颜色和背景图片。background-size属性的值连接符也是空格，表示分别设置宽度和高度。