Simplicity2 ワードプレス子テーマ スタイルのカスタマイズ【ワードプレス教室 横浜スクール】

WordPressスクール ホームページ作成作成講座準備メモ Simplicity2 子テーマ スタイル変更

/wp-content/themes/simplicity2-child/style.css

/*
Theme Name: Simplicity Child
Template: simplicity2
*/
@import url(“../simplicity2/style.css”);

#site-description {
float:left;
}
/* ヘッダー TEL& mail */
#my-e-mail:before {
content: “\f003 ”;
font-family:’FontAwesome’;
}
#my-tel:before {
content: “\f098 ”;
font-family:’FontAwesome’;
}
#my-e-mail, #my-tel {
float:right;
padding:5px;
border:solid 2px blue;
background-color:blue;
border-radius: 5px;
color:white;
font-size:8pt;
margin-right:4px;
}
/* サイドメニュー */
#nav_menu-2 ul {
padding-left:0px;
}
#nav_menu-2 ul li {
background: linear-gradient(to left, #e5c98f, #f4e3bf);;
margin-bottom: 1px;
height:30px;
padding-left:10px;
padding-top:5px;
}
#nav_menu-2 ul li a {
color:#663300;
font-weight:bold;
}
/* トップメニュー */
#navi ul {
background: linear-gradient(#e5c98f, #f4e3bf, #e5c98f);
box-shadow: 3px 3px 3px rgba(0,0,0,0.4);
}
#navi ul li {
border-left:1px solid white;
border-right:1px solid white;
}
#navi ul li a {
height:40px;
padding-top:24px;
color:#663300;
font-weight:bold;
background: linear-gradient(#e5c98f, #f4e3bf, #e5c98f);
}
#navi ul li a:hover {
background-color: rgba(255,255,255,0.6);
background-image:none;
}

ワードプレス・テーマを使用してホームページ作成中の生徒さんとの授業の予習です。