CSS - border

概要

属性名	border
値	<width> \|\| <style> \|\| <color>
初期値	個々の属性を参照
適用可能要素	すべて
継承	継承しない
メディア	visual
アニメーション	<width> と <color> は可

サポート (説明)

CSS	IE/Edge	Firefox	Chrome	Opera	Safari
CSS1	4	1	1	3.5	1

説明

ボーダーラインの太さ、線種、色をまとめて指定します。

値	説明
<width>	線の太さを指定します。詳細は border-width を参照してください。
<style>	線の種類を指定します。詳細は border-style を参照してください。
<color>	線の色を指定します。詳細は border-color を参照してください。

使用例

CSS

.sample-solid {
    border: 1px solid gray;
    width: 80px;
    height: 40px;
    margin: 0em 0em 0em 1em;
}
.sample-dashed {
    border: 1px dashed gray;
    width: 80px;
    height: 40px;
    margin: 0em 0em 0em 1em;
}
.sample-dotted {
    border: 1px dotted gray;
    width: 80px;
    height: 40px;
    margin: 0em 0em 0em 1em;
}
.sample-10 {
    border: 10px solid #993333;
    width: 80px;
    height: 40px;
    margin: 0em 0em 0em 1em;
}

HTML

<h5>1px solid</h5>
<div class="sample-solid"></div>
<h5>1px dashed</h5>
<div class="sample-dashed"></div>
<h5>1px dotted</h5>
<div class="sample-dotted"></div>
<h5>10px solid</h5>
<div class="sample-10"></div>

CSS - border

概要

サポート (説明)

説明

使用例

1px solid

1px dashed

1px dotted

10px solid

関連項目

リンク