開始
Cocoonでブログ運営始めました。
2020年12月からweb制作について勉強して、2021年4月から無料WordPressテーマ「Cocoon」を使ってブログ運営を始めました。
軽く触ってみただけですが使いやすいですね!
自分なりのブログにしようと思ったので子テーマのstyle.cssを使って細かいところまでデザインしました。
以上の2点からブロックごとそれぞれの見え方を表示させていきます。
見出し一覧
h1タグ
h2タグ
h3タグ
h4タグ
h5タグ
h6タグ
リスト
- リスト1
- リスト2
- リスト3
引用
引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。
https://shuu1104.com
コード
.entry-content pre,
.block-editor-block-list__layout pre {
border-radius: 1rem;
overflow-x: scroll;
}
.entry-content pre code,
.block-editor-block-list__layout pre code {
white-space: pre;
}
テーブル
テーブル | テーブル | テーブル |
テーブル | テーブル | テーブル |
テーブル | テーブル | テーブル |
ボタン
アーカイブ
カレンダー
カテゴリー
最新のコメント
めちゃくちゃわかりやすかったです!! ありがとうございました!!
最新の投稿
- 【webpack5】webpack インストールから導入まで使い方まとめ【web制作】
- 【webpack5】webpackのテンプレートサンプル紹介【web制作】
- 【webpack5】sassの画像やフォントのアセットファイルの依存関係を解決する【web制作】
- 【webpack5】sassのコンパイルをする【web制作】
- 【webpack5】html-webpack-pluginで複数のhtmlファイルを動的に出力する【web制作】
ソーシャルアイコン
タグクラウド
Cocoon gulp package.json sass tailwind css vscode webpack WordPress メモ
アイコンボックス
案内ボックス
案内ボックス
白抜きボックス
白抜きボックス
付箋用ボックス
付箋用ボックス
タブボックス
タブボックス
ふきだし

Aさん
ふきだし左

Bさん
ふきだし右
ブログカード
ボタン
囲みボタン
トグルボックス
トグルボックス見出し
タイムライン
タイムラインのタイトル
- ラベルタイトル
タイムライン1
- ラベルタイトル
タイムライン2
- ラベルタイトル
タイムライン3
- ラベルタイトル
タイムライン4
- ラベルタイトル
タイムライン5
アイコンリスト
見出しボックス
見出しボックスタイトル
見出しボックス
タブ見出しボックス
タブ見出しボックスタイトル
タブ見出しボックス
ラベルボックス
ラベルタイトル
ラベルボックス
終わりに
以上ブロックごとで表示させていきました。
いかがだったでしょうか?
こうして見てみるとまだまだ細かいところが調整できていないですね。
今後も継続してデザインをアップデートしていきます。
コメント