--- title: '-moz-outline-radius-bottomleft' slug: Web/CSS/-moz-outline-radius-bottomleft tags: - CSS - CSS Property - NeedsCompatTable - NeedsContent - Non-standard - Reference - 'recipe:css-property' translation_of: Web/CSS/-moz-outline-radius-bottomleft ---
{{Non-standard_header}}{{CSSRef}}

Mozilla アプリケーションにおいて、 -moz-outline-radius-bottomleftCSS のプロパティで、要素の輪郭線 ({{cssxref("outline")}}) の左下の角を丸くするために使用することができます。

構文

-moz-outline-radius-bottomleft の値は、 {{cssxref("length", "<length>")}} または境界ボックスの対応する大きさに対するパーセント値のどちらかです。 {{cssxref("calc", "calc()")}} 関数も同様に使用することができます。

<length>
要素の下端と左端の曲率を定義する円の半径を CSS の {{cssxref("length", "<length>")}} で指定します。
<percentage>
要素の左下隅の丸めを定義する円の半径で、ボーダーボックスの下辺と左辺のパーセント値で指定します。

公式定義

{{cssinfo}}

形式文法

{{csssyntax}}

アウトラインを丸める

これは Firefox 専用のプロパティなので、この例では Firefox 以外のブラウザーで表示している場合は、期待した効果が表示されません。

HTML

<p>Look at this paragraph's bottom-left corner.</p>

CSS

p {
  margin: 10px;
  border: solid cyan;
  outline: dotted green;
  -moz-outline-radius-bottomleft: 2em;
}

結果

{{EmbedLiveSample("Rounding_a_outline")}}

仕様書

標準の一部ではありません。

ブラウザーの互換性

{{Compat("css.properties.-moz-outline-radius-bottomleft")}}

関連情報