はてなブックマーク

この記事はおひさしぶりのWordPressまとめ - Qiitaでまとめたつまずいた点のパーマリンク関連の解決方法。 #前提 ページャーには WP-PageNavi を使用。ページャーがおかしくならない実装を。 デフォルトの投稿だけでなく、カスタム投稿にも反映させる。 カスタム投稿・タクソノミーの実装は Custom Post Type UI を使用。アーカイブありにすることを忘れない。 カスタム投稿のパーマリンクも設定でいるようにCustom Post Type Permalinksを入れる ##テンプレートファイル構造 投稿一覧・カテゴリー別投稿一覧 archives.php カスタム投稿一覧 archives-{カスタム投稿名}.php カスタムタクソノミー別カスタム投稿一覧 taxonomy-{カスタムタクソノミー名}.php ##ワシが目指すパーマリンク構造 投稿一覧 https

text-align: center; ブロック要素に指定。 そしたら中のインライン要素を真ん中にする。 文章の横ライン中央揃えはこれが基本。 親要素に指定しても反映してくれる。

CSSのチェックボックスなら、「チェックが入ってたら~する」って指定を行えば、 JSのクリックイベントのような使い方が出来る。 例えばハンバーガーメニューも作れる。 CSSだけで簡単にドロワーメニュー(ハンバーガーメニュー)を作る - Qiita そしてわたしはついにハンバーガーも作れるのではと気づいてしまった、、、 See the Pen ハンバーガーが食べたいので作った by himeka223 (@himeka223) on CodePen. できてしまった、、、 ハンバーガーを作る <div class="hamburger"> <div class="hamburger__body"> <div class="topping--lettuce"></div> <div class="topping--meat"></div> <div class="topping--tomato

ハンバーガーアイコンの☓になる動き、横からメニューが出てくる動き、メニューが出てるときはメインエリアを暗くすることまで、すべてCSSのみで実装可能。 See the Pen drawer menu by himeka223 (@himeka223) on CodePen. 解説 CSSのみで作るドロワーメニューの動きは、inputタグのcheckboxで制御している。 チェックがされた場合…　メニュー横から出現、アイコンを☓に、メインエリアを暗く。 チェックがはずれた場合… すべてもとに戻る。 checkbox と label の連動 checkbox を label と連動させ、 labelのクリックで、checkboxにチェックが入るように。 <!-- checkbox自体は非表示 --> <input class="l-drawer__checkbox" id="drawerChec

FLOCSSとは 「Foundation Layout Object CSS」 OOCSSやBEM、SMACSSのいいとこ取りをしたCSS設計思想。 構造 dartsassに移行しましたので構造を修正しました。 scss/ ├─ foundation/ │　├─ _base.scss │　├─ ... │　├─ index.scss ├─ global/ │　├─ mixin/ │　│　├─ _hover.scss │　│　├─ ... │　│　├─ index.scss │　├─ variable/ │　│　├─ _color.scss │　│　├─ ... │　│　├─ index.scss │　├─ index.scss ├─ layout/ │　├─ _header.scss │　├─ ... │　├─ index.scss ├─ object/ │　├─ component/ │