WordPress Customize NOTE > WordPress オリジナルテーマの作り方目次 > デザインサンプル 1回目

WordPress オリジナルテーマを作る … デザインサンプル 1回目

※縮小表示しています。クリックで拡大。
デザインやコードは、実際に使っていただいて構いません。改変も商用もなんでも自由にどうぞ。違法はダメ。

style.css

「style.css」のコード

/*
Theme Name: Custom Theme
Author: 茶子
Author URI: https://wordpress.mofuh.com/ , http://basilcat.com/
Description: このテーマは実際に使っていただいて構いません。この冒頭の情報も含め、改変も商用もなんでも自由にどうぞ。でも違法はダメ。
Version: 1.0
*/

* {
   margin: 0px;
   padding: 0px;
}

body {
   color: #666666;
   font-size: 14px;
   font-family: "ＭＳ Ｐゴシック",sans-serif;
   line-height: 160%;
   text-align: center;
   margin: 20px 0px;
}

h1 , h2 , h3 , h4 , h5 , h6 {
   font-size: 14px;
   font-weight: normal;
}

a:link {
   color: #f7bd6d;
}
a:visited {
   color: #f7bd6d;
}
a:active {
   color: #efdb75;
}
a:hover {
   color: #efdb75;
}

/* --- container --- */

#container {
   text-align: left;
   margin: 0px auto;
   width: 800px;
}

/* --- header --- */

#header {
   margin: 0px auto;
   padding: 20px;
   width: 760px;
   border: 1px solid #aaaaaa;
}

#header h1 {
   font-size: 15px;
   font-weight: bold;
}

/* --- contents --- */

#contents {
   margin-right: 20px;
   width: 580px;
}

/* --- entry --- */

.entry {
   margin-top: 20px;
   padding: 10px 15px;
   border: 1px solid #aaaaaa;
}

.entry_main {
   margin: 15px 5px;
}