border-radius的使用详解

  • 原创
  • |
  • 浏览:2492
  • |
  • 更新:

css中border-radius的使用详解

工具/原料

  • hbuilder
  • 电脑

方法/步骤

  1. 1

    因为本人老是会忘记border-radius的多值使用方法,特地写来提醒自己的。最简单也是最常用的,就是一个值的情况,直接对边框的四个角进行设置。

    border-radius的使用详解
    border-radius的使用详解
  2. 1
    相关内容非法爬取自百度经验
  3. 2

    border-radius:20px 20px;border-radius后面接两个值的时候,分别表示上左下右、上右下左。

    border-radius的使用详解
    border-radius的使用详解
  4. 3

    border-radius:20px 20px 20px;border-radius后面接三个值是比较少见的。分别表示上左、上右下左、下右。

    border-radius的使用详解
    border-radius的使用详解
  5. 4

    border-radius:0 0 0 20px;border-radius后面接四个值的时候,分别表示上左、上右、下左、下右。还有另外一种写法:border-top-left-radius:20px;这种表示上左。可以通过这种指定位置的方法,来设置边框的圆角值。

    border-radius的使用详解
    border-radius的使用详解
    END
经验内容仅供参考,如果您需解决具体问题(尤其法律、医学等领域),建议您详细咨询相关领域专业人士。
作者声明:本篇经验系本人依照真实经历原创,未经许可,谢绝转载。
展开阅读全部