webkit box rounding cornersの難易度

私はHTMLコード内のボックスに角を丸めて実装しようとしています。 Chromeでファイルを実行すると、ボックスとすべての属性がありますが、角が丸くなりません。私はMAC OSX LionでKomodo Editを使用しています。解決策は何ですか？おかげwebkit box rounding cornersの難易度

<!doctype html> 
<html lang="en"> 
<head> 
<meta charset=="utf-8" /> 
<link rel="stylesheet" href="new.css" /> 
</head> 
<body> 
    <div id="box"> 
    <p id="text"> Hello </p> 
    </div> 
</body> 
</html>

CSS3：

body { 
    text-align:center; 
} 

#box { 
display: block; 
width: 500px; 
margin:50px auto ; 
padding:15px ; 
text-align:center; 
border: 1px solid blue; 
background: red; 
-webkit-border-radius: 25p; 
} 

#text { 
    font:bold 100px Century Gothic; 
}

出典

2012-01-27 Elmir Kouliev

おそらく25pxではなく25pxになるはずです。しかし、Chromeのバージョンによっては、-webkit-を削除してborder-radiusを使用する必要があります。

出典

2012-01-27 14:25:43

これは機能しました。どうもありがとうございました –

あなたはそこに-webkit-を必要としません。ちょうどborder-radiusを使用してください。

主な問題は、xを25pxに逃したことです。

出典

2012-01-27 14:24:33

は、あなたが最後にXを逃した

-webkit-border-radius: 25px;

にする必要がありタイプミス

-webkit-border-radius: 25p;

ように見えます。クロスブラウザに準拠するには、実際にいくつかのプレフィックスを使用する必要があります。

-moz-border-radius: 25px; /*Firefox*/ 
-webkit-border-radius: 25px; /*Safari/Chrome/Konqueror*/ 
-khtml-border-radius: 25px; /*Konqueror*/ 
border-radius: 25px; /*Chrome*/

出典

2012-01-27 14:34:32 Tribbey

webkit box rounding cornersの難易度

答えて

関連する問題