メダカと自転車とetc.

元経理屋がメダカを分析したり、自転車で出かけたりするブログです

MENU

【ブログ設定備忘録】見出し『h』

f:id:historynt-02bs:20220213043040p:plain

毎日お疲れさまです

管理人のホビーライフです

 

今回は

【ブログ設定備忘録】見出し『h』

です

最後までよろしくお願いします

 

 

 

【ブログ設定備忘録】見出し『h』

当ブログで使用しているコードです

コピペできるようにしていますので、ルールを守ってお好きにお使いください

 

www.hobbylife1981.com

 

 

h1

h2

h3

h4

h5
h6

 

 

見出しh1

HTML表示
<h1>見出しh1</h1>

 

CSS表示

/* 見出しh1 */
.entry-content h1 {padding: 1rem 2rem;
border-bottom: 6px double #000;
background: #000000;
font-size: 200%;
color: #ffffff;
}

 

見出しh2

HTML表示
<h2>見出しh2</h2>

 

CSS表示

/* 見出しh2 */
.entry-content h2:first-letter {
  font-size: 150%;
  color: #eb6100;
}

 

見出しh3

HTML表示
<h3>見出しh3</h3>

 

CSS表示

/* 見出しh3 */
.entry-content h3 {padding: 1rem 2rem;
  color:#fff;
  border-top: 14px double #1c3e60;
  border-bottom: 10px double #255483;
  background:#3374b5;
    opacity:0.7;
}

 

見出しh4

HTML表示
<h4>見出しh4</h4>

 

CSS表示

/* 見出しh4 */
.entry-content h4 {padding: 1rem 2rem;
  padding: 1rem 2rem;
  border-left: 10px solid #255483;
  border-bottom: 3px solid #2d669f;
  background:#8fb8e0;
  opacity:0.8;
  }

 

見出しh5
HTML表示
<h5>見出しh5</h5>

 

CSS表示

/* 見出しh5 */
.entry-content h5 {
  padding: 1rem 2rem;
  border-left: 10px double #3374b5;
  border-right: 10px double #5492cf;
  background:#bed6ed;
  opacity:0.8;
}

 

見出しh6
HTML表示
<h6>見出しh6</h6>

 

CSS表示

/* 見出しh6 */
.entry-content h6 {
 padding: 1rem 2rem;
  border-left: 4px dotted #5492cf;
  border-right: 4px dotted #8fb8e0;
  background:#dce9f5;
}

 

 

 

 

最後まで読んでいただきありがとうございます

インスタグラムはこちら

f:id:historynt-02bs:20210804010034p:plain