15

私はborder、を使用しましたがborder-top-imageborder-image私が求めていることを行うものはないようです。

私は次のCSSを持っています:

#footer {
    overflow: hidden;
    clear: both;
    width: 100%;
    margin: 0 auto;
    padding: 26px 0 30px 0;
    border-top-image: url('http://www.mycelticcrossstitch.com/celtic%20knot%20cross%20stitch.jpg');
    font-size: 0.8461538461538462em;
    color: #aaa;
}

これは、私が取り組んでいる Web サイトには当てはまらないようです。Firefox と Chrome で試してみました。

画像を上部の境界線にのみ表示し、他の境界線を持たないようにしたい(つまり、のようなものです<hr />)

4

5 に答える 5

6

別の解決策 - 視覚的な「BEFORE」 phseudo-element を作成します。

.yourDiv::before{
    background:url("http://lorempixel.com/200/100/");
    width:100%;
    height:20px;
}
于 2015-05-23T20:08:54.900 に答える