投稿者 tel | 2012年8月19日

border-imageのGoogle Chromeでの見え方

border-imageとベンダープレフィックスをつけた-webkit-border-imageでGoogle Chrome 21で見え方がなんか違った。

使用した画像とコード。

#b0 {
width: 64px;
height: 64px;
border-width: 3px;
-webkit-border-image: url('./images/border.png') 3 repeat;
-moz-border-image: url('./images/border.png') 3 repeat;
-o-border-image: url('./images/border.png') 3 repeat;
margin-bottom: 4px;
}
#b1 {
width: 64px;
height: 64px;
border-width: 3px;
border-image: url('./images/border.png') 3 repeat;
margin-top: 12px;
}

実際にブラウザでの見え方は以下で確認できる。

http://jsdo.it/sapphire_al2o3/fm5Z


コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト / 変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト / 変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト / 変更 )

Google+ フォト

Google+ アカウントを使ってコメントしています。 ログアウト / 変更 )

%s と連携中

カテゴリー

%d人のブロガーが「いいね」をつけました。