ガイダンス画面のデザイン変更(2)

■デザインの変更を、cssで行ないます。
　→郵番欄に 438 0078 と入力してみよう。
　→変更ガイダンスが表示されます。

デザイン変更のデモ(2)

[ポイント]
▼ガイダンスをul/li形式で表示しています。
（項目をブロック要素で表示可能です）

[cssの記述例]
#autozip {
	background: #fadbd6 !important;
	padding: 5px 8px !important;
	border-radius: 8px !important;
	border: 1px solid #cf2c38;
}
#autozip span {
	padding: 7px 2px 5px !important;
	font-weight: bold !important;
	color: #cf2c38 !important;
	white-space: nowrap;
}
#autozip a {
	color: #333 !important;
	background: #fff !important;
}
#autozip a:hover {
	color: #cf2c38 !important;
}
#zip_body ul {
	margin: 0;
	padding: 0;
}
#zip_body li a {
	display: block;
	color: #333 !important;
	background: #fff !important;
}
#zip_body li a:hover {
	color: #cf2c38 !important;
	text-decoration: underline !important;
}

▼htmlでパラメータで追加変更。‥ 2014.9.27 修正

<input type="hidden" id="zipaddr_param" value="opt=1">

▲ページの先頭へ

郵便番号	-
都道府県
住所