【CSS】色のついた縦棒の段落を作る

ブルー。⇒sample1

ピンク。⇒sample2

グリーン。⇒sample3

ムラサキ。⇒sample4

オレンジ。⇒sample5

水色。⇒sample6

赤。⇒sample7

灰色。⇒sample8

スタイルシート部分は外部ファイル(sample.css)に記述。

p.sample1 {
padding: 0.25em 0.5em;/*上下 左右の余白*/
color: #494949;/*文字色*/
background: transparent;/*背景透明に*/
border-left: solid 5px #7db4e6;/*左線*/
}

 

参考ページ➡ https://saruwakakun.com/html-css/reference/h-design