blog カスタマイズ

大見出し ウクライナに平和を

中見出し ウクライナに平和を

小見出し ウクライナに平和を

大(200%) ウクライナに平和を

中(150%)　ウクライナに平和を

標準(100%)　ウクライナに平和を

小(80%)　ウクライナに平和を

見出しはこちらのサイトさんを利用させていただいてます。

retiresaki.hatenablog.com

menu覚書

<ul id="nav-menu">
<li><a href="https://npo-musicgrace-memo.hateblo.jp/archive/category/Finale%2F%E9%9F%B3%E6%BA%90%E3%82%BD%E3%83%95%E3%83%88">Finale/音源ソフト</a></li>
    
    
  <li><a href="https://npo-musicgrace-memo.hateblo.jp/archive/category/ZOOM">ZOOMレッスン</a></li>  
    
            
<li><a href="https://npo-musicgrace-memo.hateblo.jp/archive/category/PC%2F%E5%91%A8%E8%BE%BA%E6%A9%9F%E5%99%A8%2F%E3%82%BD%E3%83%95%E3%83%88">PC/周辺機器/ソフト</a></li>

<li><a href="https://npo-musicgrace-memo.hateblo.jp/archive/category/HP%2FSNS">HP/SMS</a></li>
             
<li><a href="https://npo-musicgrace-memo.hateblo.jp/archive/category/%E7%94%BB%E5%83%8F%2FPDF">画像/PDF</a></li>
            
<li><a href="https://npo-musicgrace-memo.hateblo.jp/archive/category/%E3%82%B9%E3%83%9E%E3%83%9B%2FSIM">スマホ/SIM/</a></li>
            
<li><a href="https://npo-musicgrace-memo.hateblo.jp/archive/category/%E5%B0%8F%E6%8A%80">小技</a></li>
</ul>

CSS覚書

 /* menuの幅 */
#nav-menu li {
  width: 12.5%;
}

#box2 {
    width: 270px;
}
#box2-inner {
    padding: 0 20px 0 20px;
}
#container #content {
    width: 1000px}
    
#main {
    width: 700px;    
    }
    
    /* 見出しの設定 */
    .entry-content h3 {
    position: relative;
    color: #fff;
    padding: 6px 10px;
    z-index: 2;
    }
    .entry-content h3::before,
    .entry-content h3::after {
    position: absolute;
    width: 98%;
    height: 100%;
    content: '';
    }
    .entry-content h3::before{
    top: 0px;
    left: 0px;
    z-index: -1;
    background-color: #ce0d55;
    }
    .entry-content h3::after{
    top: 4px;
    left: 4px;
    z-index: -2;
    background-color: #a58d96;
    }
    .entry-content h4 {
    position: relative;
    padding: 6px 0 6px 34px;
    color: #111;
    border-bottom: 2px solid #ce0d55;
    }
    .entry-content h4::before,
    .entry-content h4::after {
    position: absolute;
    background-color: #ce0d55;
    content: '';
    }
    .entry-content h4::before{
    top: 0;
    left: 14px;
    width: 12px;
    height: 12px;
    -webkit-transform: rotate(50deg);
    transform: rotate(50deg);
    }
    .entry-content h4::after{
    top: 18px;
    left: 8px;
    width: 8px;
    height: 8px;
    -webkit-transform: rotate(20deg);
    transform: rotate(20deg);
    }
    .entry-content h5 {
    padding: 4px 10px;
    color: #111;
    background-color: #f0f0f0;
    border-left: 8px solid #ce0d55;
    border-bottom: 1px solid #ce0d55;
    }