サイト制作が捗る、よく使うcommon.cssメモ

こんばんはー！

今回はcssのメモを残していきたいと思います。

サイトを作るときに毎回コピペして使ってるcommon.css。←主に全ページ共通の指定を記載してるやつですね

マージンの幅とかフロートとかなどを記載してます。

では早速↓

/* --▼float-------------------- */
.clear {
    clear: both;
}
.float_l {
	float: left;
}
.float_r {
	float: right;
}
.center {
	width: 100%;
	text-align: center;
}
.right {
	width: 100%;
	text-align: right;
}
/* --▼font-------------------- */

.font10 {
    font-size: 77%;
}
.font11 {
	font-size: 85%;
}
.font12 {
	font-size: 93%;
}
.font14 {
	font-size: 108%;
}
.font15 {
	font-size: 116%;
}
.font16 {
	font-size: 123.1%;
}
.font17 {
	font-size: 131%;
}
.font18 {
	font-size: 138.5%;
}
.font19 {
	font-size: 146.5%;
}
.font20 {
	font-size: 153.9%;
}
.fontb {
	font-weight: bold;
}
.font_red {
	color: #C0392B !important;
}
/* --▼margin-------------------- */
/*top*/
.mt05{ margin-top: 5px !important;}
.mt10{ margin-top: 10px !important;}
.mt15{ margin-top: 15px !important;}
.mt20{ margin-top: 20px !important;}
.mt25{ margin-top: 25px !important;}
.mt30{ margin-top: 30px !important;}

/*bottom*/
.mb00 { margin-bottom: 0 !important;}
.mb05 { margin-bottom: 5px !important;}
.mb10 { margin-bottom: 10px !important;}
.mb15 { margin-bottom: 15px !important;}
.mb20 { margin-bottom: 20px !important;}
.mb25 { margin-bottom: 25px !important;}
.mb30 { margin-bottom: 30px !important;}
.mb35 { margin-bottom: 35px !important;}
.mb40 { margin-bottom: 40px !important;}

marginは５px間隔以外（よほどのことがない限り）使わないので５px取ってます。フォントサイズも偶数pxだけにしていきたいのですがどうにもならない事例があるのでコマコマ書いてます。

ま、コレ、もう作ったのであとはコピペコピペですよ！

こういったテンプレートを作って、欲を言うとチーム全体の共通スタイルにしておけばより一層作業が捗るし意思疎通もしやすいかと思います。

じゃんじゃん使っていきましょ！

ではまた！