レスポンシブレイアウトをBootStrapで実現する

レスポンシブレイアウトをBootStrapで実現する

2020-07-01


レスポンシブレイアウト

ブログコンテンツに合わせて、コンテンツの雰囲気を作り上げる

既存のテーマをフォークしてカスタマイズする方法を採ろうとしていたのですが、部分的にソースを触って機能修正を図っても、ページ全体のバランスが崩れてしまうといった問題が発生しました。

調べて見たところ、Hexoのテーマを自作している方のブログ記事を何件かみかけ、参考にさせていただきました。

hexoテーマを自作しました。

ブログの見やすさや表現方法をより良くする目的と、HTML・CSS・Javascriptの学習をする目的の2つの目的から、Hexoのテーマを自作し、GitHub上に公開してみました。

hexo-theme-simple

PC及びスマホの療法で文章を読みやすく、アイキャッチ画像を適切な大きさで表示することを目的としました。いくつか既存のフレームワークを利用し、レスポンシブ対応にはBootstrap4を、WebフォントにはGoogle Fonts、絵文字にはFontAwesome、そして自前のCSSとBreadcrumbs用Javascriptを作成しました。