CSS3 border属性

 时间:2026-02-14 08:52:35

1、CSS3属性中有许多边框属性,主要的有三个参数:

border-image边框装饰图片

border-radius边框半径

box-shadow:盒子阴影

具体来介绍上面的三个

CSS3 border属性

2、border-radius:Rpx    是以顶角为中心,以R为半径绘制圆角

CSS3 border属性

CSS3 border属性

3、上面的一个值代表四个角相同,也可以单独设置边角

border-top-left-radius:2em;  左上角


border-top-right-radius:2em;  右上角
border-bottom-right-radius:2em;  右下角
border-bottom-left-radius:2em;  左下角

CSS3 border属性

4、box-shadow是设置元素的阴影,box-shadow:x  y   模糊度   颜色

x为x轴的阴影的偏移量

y为y轴的阴影的偏移量

模糊度就是阴影的模糊程度

颜色为阴影的颜色设置

CSS3 border属性

CSS3 border属性

5、当box-shadow写入三个参数的时候,模糊度将没有设置

例如:  box-shadow: 10px 10px #008000;

CSS3 border属性

CSS3 border属性

6、border-image有5个参数:

border-image-source: url(Media/2.png);

border-image-slice: 

border-image-width: 

border-image-outset: 

border-image-repeat: 

CSS3 border属性

CSS3 border属性

7、总结:

   CSS3的网页边框属性:

    border-radius

    border-image

    box-shadow

  • winform怎么使用timer时间控件
  • VS如何为网站开发选择合适的数据源
  • stc12 引脚设置高阻抗模式如何设置
  • android studio 虚拟机adb.exe已停止工作的处理
  • 360安全浏览器如何禁止挖矿防护功能开启
  • 热门搜索
    福建旅游网 周末旅游 贵州的旅游景点 广州旅游景点一日游 宁陕旅游 丹巴旅游攻略 旅游去哪里好玩 青藏线旅游景点 黄山市旅游景点 大丰旅游