備忘のために、cssデザインの変更方法と変更内容をメモします
1. 変更方法
2. css
/* <system section="theme" selected="report"> */ /* テーマをreportにして、本文の横幅を出来るだけ大きくとる*/ /* このテーマはレスポンシブデザイン非対応*/ /* [https://blog.hatena.ne.jp/-/store/theme/12921228815712830663:title] */ @import "/css/theme/report/report.css"; /* </system> */ /* <system section="background" selected="default"> */ /* default */ /* </system> */ /* for report */ /* フォント */ body { font-family: 'Helvetica Neue', 'Helvetica', 'Univers', 'Arial', 'Hiragino Kaku Gothic Pro', 'Meiryo', 'MS PGothic', sans-serif; } .entry-title a { font-size: 160%; } .entry-content { font-size: 16px; } .entry-content h1 { padding: 6px 10px; border-left: 8px solid #b8d200; border-bottom: 1px solid #b8d200; color: #333; line-height: 1.5; background-color: #f5f5f5; } .entry-content h2 { padding: 6px 10px; line-height: 1.5; background-color: #f5f5f5; } /* ソースコード表示 */ .entry-content pre{ white-space: pre-wrap; word-wrap: break-word; background: #efefef; } .entry-content pre.code { font-size: 90%; } /* 引用表示 */ .entry blockquote { border-top: none; border-right: none; border-bottom: none; border-left: 3px solid #b3bfc7; padding: 2px 0 2px .7em; color: #626e77; } /* 画像表示 */ img{ display: inline-block; box-sizing: border-box; border: solid 1px #333; } @media screen and (min-width:1200px) { #container{ width: 95%; } #content { padding-left: 70px; } #content-inner { zoom: 1; } #content-inner:after { content: ''; display: block; clear: both; } #wrapper { float: left; width: 100%; /*(サイドバーの幅 + 記事とサイドバーの間隔 ) × (-1) */ margin-right: -220px; } #wrapper #main { margin-left: 0px; /*サイドバーの幅 + 記事とサイドバーの間隔 */ margin-right: 220px; } #box2 { float: right; /*サイドバーの幅 */ width: 180px; } /* キーワード下線を消す */ a.keyword { border: transparent 0px; }
ソースコード
kei-kmj.github.io/hatena_custom.css at main · kei-kmj/kei-kmj.github.io · GitHub