WEBページ作成リファレンス
cman.jp cman.jp > WEBページ作成TOP > CSSリファレンス > 「罫線の底辺の太さ設定」

border-bottom-width 「罫線の底辺の太さ設定」

border-bottom-width プロパティは罫線の底辺の太さの設定を行うことができます。

CSS Ver.適用要素継承
2.1全てしない
広告

border-bottom-width の値

【構文】

border-bottom-width : [width;
width [太さの指定] ( サンプル )
border-bottom-width: thin;細い
border-bottom-width: medium;標準
border-bottom-width: thick;太い
border-bottom-width: ~px;太さを数値で指定(ex. 1px、10px)
ページTOP

border-bottom-width のサンプル

1.罫線の太さの指定サンプル

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>罫線の太さの指定サンプル</title>
  <style type="text/css">
  <!--
    div
    {
        height: 50px;
        width : 70px;
        margin: 5px;
        float : left;
        border-style: solid;
    }
    div.s1{ border-bottom-width:  thin;}   /* 細い線 */
    div.s2{ border-bottom-width:  medium;} /* 標準線 */
    div.s3{ border-bottom-width:  thick;}  /* 太い線 */
    div.s4{ border-bottom-width:  1px;}    /* 1px */
    div.s5{ border-bottom-width:  5px;}    /* 5px */
    div.s6{ border-bottom-width:  10px;}   /* 10px */
  -->
  </style>
</head>
<body>
<p style="font-size:12pt; " >罫線の底辺の太さ指定サンプル</p>
<div class="s1">細い線(thin)</div>
<div class="s2">標準線(medium)</div>
<div class="s3">太い線(thick)</div>
<div class="s4">1px の線</div>
<div class="s5">5px の線</div>
<div class="s6">10pxの線</div>
</body>
</html>
ページTOP
広告
QrCode
このページのURL
スマートフォン・タブレット運営 : CMAN 株式会社シーマン