html - CSS3: 画像に角を丸くする

Question

フレームに丸みを帯びた角を追加しようとしましたが、mozilla でのみ機能し、chrome や IE では機能しません。

プロパティをイメージタグに追加するのではなく、border-radius代わりにキャンバスタグに追加しています

canvas {border-bottom-right-radius: 50px;border-bottom-left-radius: 50px;}

誰でも何か提案できますか？

ウェブサイトはn1bar.comです

Answer 1

次のように、すべてのブラウザの半径を設定していることを確認してください。

canvas {
    -moz-border-bottom-right-radius: 50px; /* Firefox */
    -webkit-border-bottom-right-radius: 50px; /* Safari, Chrome */
    border-bottom-right-radius: 50px; /* CSS3 */

    -moz-border-bottom-left-radius: 50px; /* Firefox */
    -webkit-border-bottom-left-radius: 50px; /* Safari, Chrome */
    border-bottom-left-radius: 50px; /* CSS3 */
}

Answer 2

少しきれいなバージョン:

-moz-border-radius: 0 0 50px 50px;
-webkit-border-radius: 0 0 50px 50px;
border-radius: 0 0 50px 50px;

基本的には「左上、右上、右下、左下」の順番です。