CSSのborder-styleに「double」とかってあったのね…

SPONSORED LINK

Pocket

border

見出しデザインの参考にしたい CSSで作るhタグのサンプル集」を読んでいて「へー」と思ったのでショートエントリー。CSSのborder-styleって「solid」「dotted」ぐらいしかないと思っていたのですが(僕だけじゃないと信じたいたい!)、他にもいろいろあるのですね。

ざっと紹介すると…。

  • none: 枠線なし
  • hidden: noneと同じだけどtableの枠線と衝突しちゃうときに使う
  • dotted: 点線
  • dashed: ダッシュ(点線よりちと長い)
  • solid: 普通の線
  • double: 二重線
  • groove, ridge, inset, outset: 3Dっぽい効果を出す
  • inherit: 親要素から継承

ブラウザの対応状況に気を付ける必要がありますが、うまく使えば枠線だけでさまざまなスタイルが作れるかもですね。画像つかうのがどうもね、というときに検討したいところです。

» CSS border-style property

ツイッターもやっています!

SPONSORED LINK

  1. No comments yet.

  1. No trackbacks yet.