新着! 44ページの電子書籍「CSS in 44 minutes」がリリースされました! 😃

今すぐ入手 →

#border-color

要素の境界線の色を定義します。

デフォルト border-color: transparent;

境界線に透明色を適用します。境界線は、`border-width` の値で定義された*スペース*を依然として占有します。

border-color: red;

あなたは、140以上の色名のいずれかを使用できます。

border-color: #05ffb0;

あなたは、16進数のカラーコードを使用できます。

border-color: rgb(50, 115, 220);

あなたは、rgb() カラーコードを使用できます

  • 最初の値は `red` です
  • 2番目の値は `green` です
  • 3番目の値は `blue` です

それぞれの値は、0 から 255 までの値を持つことができます。

border-color: rgba(50, 115, 220, 0.3);

あなたは、rgba() カラーコードを使用できます

  • 最初の3つの値は `rgb` です
  • 4番目の値は `alpha` チャネル用で、色の不透明度を定義します

アルファ値は、ゼロの 0 (透明) から 1つの 1 (不透明) までの範囲です。

border-color: hsl(14, 100%, 53%);

あなたは、hsl() カラーコードを使用できます

  • 最初の値は `hue` 用で、0 から 359 までの範囲です
  • 2番目の値は `saturation` 用で、0% から 100% までの範囲です
  • 3番目の値は `luminosity` 用で、0% から 100% までの範囲です

border-color: hsla(14, 100%, 53%, 0.6);

あなたは、hsl()a カラーコードを使用できます

  • 最初の3つの値は `hsl` です
  • 4番目の値は `alpha` チャネル用で、色の不透明度を定義します

アルファ値は、ゼロの 0 (透明) から 1つの 1 (不透明) までの範囲です。