====== カスタマイズ その4 ====== ===== 見出しの変更 ===== 見出しh1~h6をデザインに合わせ修正していきます。 /* general headline setup */ div.dokuwiki h1, div.dokuwiki h2, div.dokuwiki h3, div.dokuwiki h4, div.dokuwiki h5 { color: __text__; background-color: inherit; font-size: 100%; font-weight: normal; margin: 0 0 1em 0; padding: 0.5em 0 0 0; border-bottom: 1px solid __border__; clear: left; } /* special headlines */ div.dokuwiki h1 {font-size: 160%; margin-left: 0px; font-weight: bold;} div.dokuwiki h2 {font-size: 150%; margin-left: 20px;} div.dokuwiki h3 {font-size: 140%; margin-left: 40px; border-bottom: none; font-weight: bold;} div.dokuwiki h4 {font-size: 120%; margin-left: 60px; border-bottom: none; font-weight: bold;} div.dokuwiki h5 {font-size: 100%; margin-left: 80px; border-bottom: none; font-weight: bold;} この辺からは自分の趣味にあわせ好き勝手編集していきます。 div.dokuwiki h1,h2,h3,h4,h5 { padding: 1px 0px 1px 8px; font-weight: bold; color: #660000; border-color: #dc143c; } div.dokuwiki h1 { margin: 0px 0px 8px 0px; font-size: 14px; bac2kground-color: #ffc0cb; border-style: solid; border-width: 1px 1px 1px 12px; } div.dokuwiki h2 { margin: 0px 0px 8px 20px; font-size: 12px; background-color: #ffc0cb; border-style: solid; border-width: 1px; } div.dokuwiki h3 { margin: 0px 0px 8px 40px; font-size: 12px; background-color: #ffdddd; border-style: solid; border-width: 1px 0px 1px 0px; } div.dokuwiki h4 { margin: 0px 0px 8px 60px; color: #aa143c; font-size: 12px; background-color: #ffeeee; border-style: solid; border-width: 0px 0px 1px 0px; border-color: #dc143c; } div.dokuwiki h5 { margin: 0px 0px 8px 80px; color: #aa143c; font-size: 12px; background-color: #ffeeee; border-style: dotted; border-width: 0px 0px 1px 0px; border-color: #dc143c; } インデントも修正します。 /* indent different sections */ div.dokuwiki div.level1 { margin-left: 3px; } div.dokuwiki div.level2 { margin-left: 23px; } div.dokuwiki div.level3 { margin-left: 43px; } div.dokuwiki div.level4 { margin-left: 63px; } div.dokuwiki div.level5 { margin-left: 83px; } 日本語の文章の場合は、見出しの後は段落を下げたほうが見やすくなるので、段落を調整します。 div.dokuwiki div.level1,div.level2,div.level3,div.level4,div.level5 { padding: 0px 0px 1em 0px; } div.dokuwiki div.level1 { margin: 0px 0px 0px 20px; } div.dokuwiki div.level2 { margin: 0px 0px 0px 40px; } div.dokuwiki div.level3 { margin: 0px 0px 0px 60px; } div.dokuwiki div.level4 { margin: 0px 0px 0px 80px; } div.dokuwiki div.level5 { margin: 0px 0px 0px 100px; } ===== リストの変更 ===== リスト表示も字下げ量が多すぎるので修正していきます。 /* unordered lists */ div.dokuwiki ul { line-height: 1.5em; list-style-type: square; list-style-image: none; margin: 0 0 1em 3.5em; color: __text_alt__; } /* ordered lists */ div.dokuwiki ol { line-height: 1.5em; list-style-image: none; margin: 0 0 1em 3.5em; color: __text_alt__; font-weight: bold; } サイドメニューは別個に設定します。 /* unordered lists */ div.dokuwiki ul { line-height: 1.5em; list-style-type: disc; list-style-image: none; margin: 0 0 1em 1.5em; color: #cb143c; } /* ordered lists */ div.dokuwiki ol { line-height: 1.5em; list-style-image: none; margin: 0 0 1em 2em; color: #cb143c; font-weight: bold; } ===== サイドメニュー専用の変更 ===== サイドメニューはページとは別の設定を行います。 #ydlBoxMenu h1 a { margin: 0 0 0 12px; color: #fff !important; } #ydlBoxMenu h1 { margin: 0; padding: 0; width: 212px; height: 24px; border-style: none; background: __background__ url(ydlimgs/category.png) no-repeat top; text-shadow: 1px 1px 1px #000; } #ydlBoxMenu ul { font-size:12px; line-height: 1.3em; list-style-type: disc; list-style-image: none; margin: 0 0 0 0.5em; color: #cb143c; }