2

このページには、次の css を含むテーブルがあります(それぞれtdにクラスがありますbox)

.box{
    border: 3px outset #959595;
    width:25px;
    height: 25px;
    background-color: #dddddd;
    cursor: pointer;
}

table{
    border-collapse: collapse;
    border-spacing: 0px;
    border: 4px inset #444;
}

私はFirefoxで欲しいものを手に入れます

ファイアフォックス

しかし、他のブラウザでは、私が望むように機能していないようです

クロム

4

1 に答える 1

3

(re: )に関する MDN のドキュメントborder-styleから:outset

ボックスを 3D エンボスで表示する境界線を表示します。の反対ですinset。border-collapseに設定してテーブル セルに適用するとcollapsed、この値は のように動作しridgeます。

テーブルには がborder-collapse: collapse;あるため、実際にborder-style: ridgeは Firefox のようにレンダリングされます。

に変更されない可能性のあるブラウザ間でスタイルを正規化するように設定するかborder-collapse: separate;設定します。border-style: ridge;outsetridge

于 2013-10-02T13:02:03.667 に答える