CSS新增边框属性

CSS新增边框属性

圆角

  • border-radius(设置或检索对象使用圆角边框,提供2个参数,2个参数以"/"分隔,每个参数允许设置1~4个参数值,第一个参数表示水平半径,第二个参数表示垂直半径。如果第2个参数省略,则默认等于第1个参数)
    • 参数1(水平半径)/参数2(垂直半径)
    • 参数1
    • 参数1(四个参数值)/参数2(四个参数值)
      左上 右上 右下 左下/左上 右上 右下 左下
    • 参数1(三个参数)/参数二(三个参数)
      左上 右上和下左 右下/左上 右上和下左 右下
    • 提供两个参数的
      左上和右下 右上和左下/左上和右下 右上和左下
    • 提供一个参数
      用于四个角
  • border-top-left-radius
    设置或检索对象的左上角圆角边框
  • border-top-right-radius
    设置或检索对象的右上角圆角边框
  • border-bottom-left-radius
    设置或检索对象的左下角圆角边框
  • border-bottom-right-radius
    设置或检索对象的右下角圆角边框

盒子阴影

  • box-shadow(可以设定多组效果,每组参数值以逗号分隔)
    • box-shadow:none;无阴影
    • box-shadow:参数1,参数2,参数3....;
    • box-shadow:参数1(值1 值2 值3 值4 值5 值6...);
    • 值1:用来设置对象的阴影水平偏移值。可以为负值
    • 值2:垂直偏移值,可以为负值
    • 值3:模糊值。不允许为负值。
    • 值4:阴影外延值。可以为负值。
    • 值5:设置对象的阴影的颜色。
    • 值6:设置对象的阴影类型为内阴影。改值为空时,则对象的阴影类型为外阴影。

posted on 2017-08-05 21:45  溢流谦  阅读(132)  评论(0编辑  收藏  举报

导航