3

クロムの問題トラッカーでバグを作成しようとしていましたが、最初にここで試してみようと思いました。

このサイトを見てみてください: http://www.norabrowndesign.com/css-experiments/border-image-frame.html

ただし、chrome は現在、border-image-outset をサポートしているようです。

コマンドに応答しますが、期待どおりに動作しません。Is は画像を外側に移動し、コンテンツの周囲の余白を減らすのではなく、余白を増やします。仕様を読んでも、chrome の動作が間違っているかどうかはわかりませんが、リンクされたサイトの作成者が別のことを期待していたことは確かです。

さらに、現在の動作が正しい場合、その目的が何なのかわかりません。そして、大きなボーダー画像の問題は、まったく解決策がありません。

それで、それは何ですか、バグを送信する必要がありますか？

4

1 に答える 1

1

Chrome は正常に動作すると思います。border-image-outsetボーダーボックスを超えてボーダー画像領域を拡張することになっています。Chromeでそれを行うようです。コンテンツの周囲の空白を削除するには、 を使用して達成できる逆の操作が必要ですborder-image-width。

border-image-widthはボーダー画像領域を分割し、基本的にborder-image-slice(ボーダー画像を分割する) に対応します。その初期値は1(対応する 計算された の倍数border-width) です。したがって、border-image-widthすべてのスライスを割り当てないと、サイズが に変更されborder-widthます。

w3.orgの border-image-widthを参照してください

境界画像のサイズを維持しながらコンテンツの周囲の空白を削除するには、縮小して適切な値にborder-width設定する必要があります。border-image-width

質問の例で次の変更を試してください。

#one {
  border-width: 74px;
  border-image-width: auto;
}
于 2013-01-25T09:15:35.897 に答える