はてなブログの備忘録
このブログを書くにあたって設定変更したことをメモする。
デザインCSS(NEW)
※デフォルトの行間が広すぎるので設定した。
※検索したwebで見つけた記述「.entry-content p {」ではうまくいかず、さらに探した結果「.entry .entry-content p {」とした。
※h1~h6要素のマージンも気に入らなかったのでカスタマイズした。(2023-3-26追記)
※pre要素のマージンも気に入らなかったのでカスタマイズした。(2023-4-2追記)
/* p要素の行間を狭める */ .entry .entry-content p { margin: 3px 0; } /* h1~h6要素行間を狭める */ .entry .entry-inner h1 { margin: 12px 0px 6px 0px; } .entry .entry-inner h2 { margin: 12px 0px 6px 0px; } .entry .entry-inner h3 { margin: 12px 0px 6px 0px; } .entry .entry-inner h4 { margin: 12px 0px 6px 0px; } .entry .entry-inner h5 { margin: 12px 0px 6px 0px; } .entry .entry-inner h6 { margin: 12px 0px 6px 0px; } /* pre要素の行間を狭める */ .entry .entry-content pre { margin: 3px 0; }
デザインCSS(OLD)
※マークダウン記法に移行する前はpre要素について設定していました。
/* 行間を狭める */ .entry .entry-content p { margin: 3px 0; } /* コード貼り付けの1行目を目立たなくする */ .entry .entry-inner pre { padding-top: 0px; padding-bottom: 24px; /* codeの1行に合わせている */ }
コードブロック
※markdown記法で フェンスコード・ブロック を使うとシンタックスハイライトしてくれたので今後はmarkdown記法を推していく。
```javascript // 内容 ```
リンク(markdown)
※プレビューでは表示されないが、ブログを公開したら動作する様子です。
※ただし「 target="_blank" rel="noopener"」が書けないので、元のwebページの表示をやめてリンク先に遷移します。
リンク先は [ここ](https://hatenablog.com/) です。
実際のリンク→「リンク先は ここ です。」
リンク(html)
※プレビューでも動作する様子です。
※「 target="_blank" rel="noopener"」を書きたいのでmarkdown記法でもこちらを推していきます。
リンク先は <a href="https://hatenablog.com/" target="_blank" rel="noopener">ここ</a> です。
実際のリンク→「リンク先は ここ です。」