border-imageがうまく表示されない

画像の縁を飾るborder-imageを勉強中ですが、表示が表示されているところと、されないところがあります。
これはネットにでているものです。
URL https://weblan3.com/css/border-image　です。
border_A1,border_B1,border_C1が表示されません。
border_A2,border_B2,border_C2は表示されています。
原因は同じところだと思い。border_A2 を見ながらborder_A1をいじってみたのですが、
うまくいきません。
sample.htmlとimagesフォルダ、cssフォルダは同じフォルダにあります。
よろしくお願いいたします。


//sample.html
<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>ボーダーに画像を使う</title>
    <link href="css/border-image-3.css" rel="stylesheet"> 
    
</head>   
<body>
    パターンA
    <div class="box_sample border_A1">
        border-style: solid;
        border-width: 30px;
        border-image: url(../images/border_image2.png) 30 repeat;
        border-image-width: 30px;
    </div>

    <div class="box_sample border_A2">
        border-style: solid;
        border-width: 30px;
        border-image-source: url(../images/border_image2.png);
        border-image-slice: 30;
        border-image-width: 30px;
        border-image-repeat: repeat;
    </div>


    パターンB
    <div class="box_sample border_B1">
        border-style: solid;
        border-width: 10px 20px;
        border-image: url(../images/border_image2.png) 30 15 round;
        border-image-width: 9px 15px;
    </div>

    <div class="box_sample border_B2">
        border-style: solid;
        border-width: 10px 20px;
        border-image-source: url(../images/border_image2.png);
        border-image-slice: 30 15;
        border-image-width: 9px 15px;
        border-image-repeat: round;
    </div>


    パターンC
    <div class="box_sample border_C1">
        border-style: solid;
        border-width: 15px 30px;
        border-image: url(../images/border_image2.png) 30 stretch;
        border-image-width: 15px 30px;
    </div>

    <div class="box_sample border_C2">
        border-style: solid;
        border-width: 15px 30px;
        border-image-source: url(../images/border_image2.png);
        border-image-slice: 30;
        border-image-width: 15px 30px;
        border-image-repeat: stretch;
    </div>
</body>
</html>


//sample.css
@charset "utf-8";

    .box_sample {
     padding: 5px;
     margin: 0 0 10px 0;
    }

    // パターンA
    .border_A1 {
     border-style: solid;
     border-width: 30px;
     border-image-source: url(../images/border_image2.png) 30 repeat;
     border-image-width: 30px;
    }
    .border_A2 {
     border-style: solid;
     border-width: 30px;
     border-image-source: url(../images/border_image2.png);
     border-image-slice: 30;
     border-image-width: 30px;
     border-image-repeat: repeat;
    }

    // パターンB
    .border_B1 {
     border-style: solid;
     border-width: 10px 20px;
     border-image-source: url(..images/border_image2.png) 30 15 round;
     border-image-width: 9px 15px;
    }
    .border_B2 {
     border-style: solid;
     border-width: 10px 20px;
     border-image-source: url(../images/border_image2.png);
     border-image-slice: 30 15;
     border-image-width: 9px 15px;
     border-image-repeat: round;
    }

    // パターンC
    .border_C1 {
     border-style: solid;
     border-width: 15px 30px;
     border-image: url(../images/border_image2.png) 30 stretch;
     border-image-width: 15px 30px;
    }
    .border_C2 {
     border-style: solid;
     border-width: 15px 30px;
     border-image-source: url(../images/border_image2.png);
     border-image-slice: 30;
     border-image-width: 15px 30px;
     border-image-repeat: stretch;
    }

s8_chu

2019/02/02 10:26

スーパーリロード( http://uzurea.net/cacheclear-and-superreload-2018/ )を行ってもその問題は改善されませんか？

退会済みユーザー

2019/02/02 10:33

むつかしくておしゃることが理解できないです。すみません。いろいろ、行ったり来たり1日苦戦しています。

s8_chu

2019/02/02 10:38

スーパーリロードとは何か、などはこちら( https://wa3.i-3-i.info/word13838.html )がわかりやすいと思いますが、このサイトを読んだ上でも理解ができませんか？

退会済みユーザー

2019/02/02 11:53

要はキャッシュを削除しろってことです。

退会済みユーザー

2019/02/02 12:23

パターンA,パターンB,パターンCもA2,B2,C2は表示されます。A1,B1,C1は表示されません。表示されないコードを表示されるコードのコードにしたりしましたが、変化がありませんでした。ちなみにborder_A1のborder-imageをborder-image-sourceにしてみたりしました。

退会済みユーザー

2019/02/02 14:09 編集

スーパーリロードの結果はどうでしたか？その結果が上だと言うことでしょうか？

退会済みユーザー

2019/02/03 00:52

そうです。もう少し頑張ってみます。ありがとうございます。