JavaScript HTML DOM Style borderImage 属性

  • borderImage 属性

    borderImage属性是一个简写属性,用于设置borderImageSourceborderImageSliceborderImageWidthborderImageOutsetborderImageRepeat属性。省略的值设置为其默认值。
    将图像指定为<div>元素周围的边框:
    /*  Safari 5 以及更早版本 */
    document.getElementById("myDIV").style.WebkitBorderImage = "url(border.png) 30 30 round"; 
    
    /* 标准语法 */
    document.getElementById("myDIV").style.borderImage = "url(border.png) 30 30 round";
    尝试一下
  • 浏览器支持

    IE/Edge Chrome FireFox Safari Opera
    属性
    borderImage
    11.0+
    16.0+
    4.0 Webkit
    15.0+
    3.5 Moz
    6.0+
    3.1 Webkit
    15.0+
    11.0 O
  • 语法

    返回borderImage属性:
    object.style.borderImage
    设置borderImage属性:
    object.style.borderImage = "source slice width outset repeat|initial|inherit"
  • 属性值

    描述
    borderImageSource 要用作边框的图像的路径
    borderImageSlice 图像边界的向内偏移
    borderImageWidth 图像边框的宽度
    borderImageOutset 边框图像区域延伸到边框之外的量
    borderImageRepeat 是否应重复,舍入或拉伸图像边框
    initial 将此属性设置为其默认值。 阅读有关initial信息
    inherit 从其父元素继承此属性。 阅读有关inherit的信息
  • 技术细节

    项目 描述
    默认值: none 100% 1 0 stretch
    返回值: 一个字符串,表示元素的border-image属性
    CSS版本 CSS3
  • 相关页面

    CSS参考:border-image属性