zoukankan      html  css  js  c++  java
  • [移动端] IOS下border-image不起作用的解决办法

    上周五突然接到现场的一个需求,做一个移动端的劳模展示页面。现场美工把原型图发了过来。这个样子的:

    说实在的很想吐槽一下我们美工的审美哈,不过这不是重点。

    因为边框是需要特殊花纹的所以打算用border-image实现。

      .example{
        ……
    
        border:6px solid transparent;
        -webkit-border-image:url(../img/border_img.jpg) 6 6 round;
        border-image:url(../img/border_img.jpg) 6 6 round;
        ……
      }
    

    最终发现安卓显示正常。IOS边框是显示不出来的。

    解决办法是:
    把 border:6px solid transparent; 替换为单独的属性,即:border-style 和 border-width。

      .example{
        ……
        border-style: solid;
        border- 6px;
        -webkit-border-image:url(../img/border_img.jpg) 6 6 round;
        border-image:url(../img/border_img.jpg) 6 6 round;
        ……
      }
    

    希望对大家有帮助。

  • 相关阅读:
    node 搭建代理服务器
    jquery常见的方法
    静态布局字体标签
    ajax简单了解
    GET方式缓存清除
    Ajax使用概述
    SESSION技术
    COOKIE技术
    PHP操作数据库(二)-增删改查操作
    PHP操作数据库(一)-步骤介绍
  • 原文地址:https://www.cnblogs.com/xiaolu-web/p/6795372.html
Copyright © 2011-2022 走看看