「CSSを修正したら表示がおかしくなった」「初期状態に戻したい」時は、以下のCSSをコピーし、そのままCSSファイルに貼り付けて下さい。すると、当初の状態に戻すことができます。
@charset"UTF-8";
/*
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
■伝令くんGOLD デザイン修正用CSSファイル
・コマースデザイン株式会社が提供する「伝令くんGOLD」の
デザインを修正するために使います。
・中上級者向けです。修正には、CSSについての知識が必要です。
・CSSを誤って書き換えた時に「元に戻す」ために、
このファイルの内容を、他のテキストファイルに保存してから
修正することを勧めます。
・不明点は、https://www.commerce-design.net/etfaq/%E3%81%8A%E5%95%8F%E5%90%88%E3%81%9Bまで。
[2015/3/24改訂]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
*/
/*
━━━━━━━━━━━━━━━━━━━━━━━━━━◇◇◆
↓ここでは、ティッカー(流れる文字)のデザインを修正できます。↓
━━━━━━━━━━━━━━━━━━━━━━━━━━◇◆◇
*/
/* ◆---------- リンクについて----------◆*/
#ticker a {
color:#1D54A7;
/*↑文字の色を変更します 例)blue→black*/
text-decoration:none;
transition: 0.5s;
}
#ticker a:hover {
color:#C00000;
/*↑文字の色を変更します 例)blue→black*/
text-decoration:underline;
/*↑マウスを重ねると文字にアンダーラインを表示します*/
}
/* ◆---------- 枠について ----------◆*/
#ticker .box{
border:1px solid #cccccc;
/*↑枠線の色。現在はグレー*/
background-color :#F2F4F6;
/*↑背景色。現在はグレー*/
font-size :14px;
/*↑文字の大きさ(20px以下推奨)*/
font-weight:normal;
/*↑文字の太さ(太くしたい時は、boldに書き換えてください)*/
font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, sans-serif;
/*↑字体。変更した場合は、文字の大きさも併せてご確認ください*/
}
/* ◆---------- 枠の中にある[速報]と書いてある画像を差し替える場合に使います ----------◆*/
#ticker .box{
background-image:url("rimg.gif");
/*↑「速報」の代わりに利用したい画像のファイル名。このフォルダに使いたい画像を入れて下さい。*/
padding-left: 63px;
/*↑上の画像のファイル名を変更した場合は、画像の横幅+2pxに設定してください*/
}
/* ↓ここは変更しないでください↓ */
#ticker{ margin:0; padding:0; }
#ticker .box{height: 23px; width:1200px; background-repeat:no-repeat; background-position:2px 2px; padding-top:2px; padding-bottom:2px; padding-right:2px; overflow: hidden;}
#ticker .box ul { margin:0; padding:0; list-style:none; }
#ticker .box ul li{line-height:27px; float:left; width:1100px;}
#ticker #signature{ line-height: 1; padding:2px 0 0 2px; }
/*
━━━━━━━━━━━━━━━━━━━━━━━━━━◇◇◆
↓ここでは、サイドバーのデザインを修正できます。↓
━━━━━━━━━━━━━━━━━━━━━━━━━━◇◆◇
*/
/*◆---------- 全体 ----------◆*/
body.side {
color:#000000;
/*↑文字の色を変更します 例)blue→black*/
line-height:120%;
}
/*◆---------- リンクについて----------◆*/
#sidebar a{
color:blue;
/*↑リンク部分の文字色を変更します 例)blue→black*/
text-decoration:none;
transition: 0.5s;
}
#sidebar a:hover {
color:#C00000;
text-decoration:none;
}
/*◆---------- 赤文字の「○○ランキング」表示----------◆*/
div.genre {
color:#cc0000;
/*↑リンク部分の文字色を変更します*/
width:90%;
margin:0 auto;
text-align:center;
font-size:11px;
letter-spacing: -1px;
}
/*◆---------- 黄色い背景の「○位受賞」見出し ----------◆*/
div.rank {
background-color:#ffcc00;
/*↑見出し部分の文字の背景色を変更します*/
font-size:14px;
/*↑文字サイズ*/
font-weight:bold;
/*↑文字を太字に*/
text-align:center;
/*↑文字をセンタリング*/
margin-bottom:5px;
font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, sans-serif;
}
/*◆---------- 枠について----------◆*/
.table {
width:160px;
/*横幅200pxの場合は、枠の横幅は160pxにして下さい*/
/*横幅150pxの場合は、枠の横幅は123pxにして下さい*/
}
/*◆---------- 商品画像のサイズ----------◆*/
#img {
max-height:150px;
max-width:150px;
/*↑横幅200pxの場合*/
/*↓横幅150pxの場合
max-height:108px;
max-width:108px;
*/
border:none;
}
.itemimg {
text-align:center;
/*↑画像をセンタリング*/
}
/*
━━━━━━━━━━━━━━━━━━━━━━━◇◇◆
↓ここでは、ランキング市場風のデザインを修正できます。↓
━━━━━━━━━━━━━━━━━━━━━━━◇◆◇
*/
/*
#standard .behind{
color:#808080 !important;
}
↑ランキング市場へのリンクを目立たなくしたい場合に使います。*/
#standard a{
color:#1D54A7;
/*↑リンク部分の文字色を変更します 例)blue→black*/
text-decoration:none;
}
#standard a:hover {
color:#C00000;
text-decoration:underline;
/*↑マウスを重ねると文字にアンダーラインを表示します*/
}
/*
━━━━━━━━━━━━━━━━━━━━━━━◇◇◆
↓↓↓ここから下は変更しないでください↓↓↓
━━━━━━━━━━━━━━━━━━━━━━━◇◆◇
*/
/*base*/
body#standard { margin:4px 0; background:#ffffff; }
.ranking_box {
width:540px;
line-height: 1.3em;
font-size: 84%;
clear:both;
border-bottom: solid 1px #BBB;
overflow: hidden;
margin:0;
}
.ranking_box dl, .ranking_box dd, .ranking_box div {
margin:0;
}
.ranking_box dd {
display: block;
}
.ranking_box img {
border: 0 none;
}
.ranking_box .rank, .imageBox {
float:left;
}
.detail {
margin-left:206px !important;
padding: 5px 5px 2px 0;
}
a{word-break:break-all;}
/*Background*/
.ranking_box .rank {
background: url("http://image.event.rakuten.co.jp/ranking/mayall/img/ranking/A/bg_rank4later.gif") repeat-y 0 0px;
}
.top3box .rank {
background: url("http://image.event.rakuten.co.jp/ranking/mayall/img/ranking/A/bg_rank1to3.gif") repeat-y 0 0px;
}
.top1BgColor {
background-color:#FFEBE0;
}
/*rank*/
.ranking_box .rank {
width: 56px;
min-height: 150px;
height: 150px;
}
.ranking_box .rank div {
margin: 65px 0 0 0;
color: #BF0000;
font-size: 220%;
font-weight: bold;
text-align: center;
}
.ranking_box .rank span {
font-size:12px;
}
.top3box .rank, .top3box .rank img {
width:56px;
margin: 0;
}
/*img*/
dd.imageBox{padding: 13px 10px 13px 0;}
dd.imageBox div {
width: 138px;
height: 138px;
layout-grid-line:138px;
display: table-cell;
text-align: center;
vertical-align: middle;
}
dd.imageBox div img {
max-width: 138px;
}
/*itemname*/
.itemname {
padding-top:8px;
height: auto;
overflow:hidden;
word-break: break-all;
font-weight:bold;
}
/*else*/
dd.imageBox div * { vertical-align: middle; }
.info {
text-align: right;
padding-top:5px;
font-size:11px;
}
.price{
padding: 1px 0;
font-size: 148%;
color: #BF0000;
font-weight: bold;
text-align: right;
}
.review{font-weight:normal; padding:7px 0 0;}
.rnkRanking_underbox{text-align: right;}
/*bookmark*/
.genreRankingBookMarkBox{width: 90px; margin-bottom:6px !important;}
.ranking_box div#bkmDlogArea{margin-left: 0px !important; margin-top: -5px !important;}
.ranking_box div#bkmDlogArea, .ranking_box div#bkmDlogArea div#bkmDlog, .ranking_box div#bkmDlogArea div#bkmDlogComp{width: 328px !important;}
.ranking_box div.bookmarkArea div.bkm{padding:0 !important;}
/*sidebar-review*/
#sidebar .review a{
color:#d94c3a;
font-size:12px;
display:block; width:100%; margin-top:-1em; margin-bottom:3px;
}
#sidebar .timestamp{
font-size:12px; color:#808080;
}
/*over 10*/
.recommend {margin-left: 25px;}
.recom .itemname a.info{visibility: hidden;}
/*renewed*/
.flat_ver .top1BgColor {
background-color:#fff;
}
.flat_ver .ranking_box .rank, .flat_ver .top3box .rank {
background:#fff;
}
.flat_ver .rank {
position:relative;
}
.flat_ver .rank div {
font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, sans-serif;
}
.flat_ver .rank img {
position:absolute;
top:33px;
left:0;
}
/*signature*/
#signature{ font-size:10px; color:#808080; line-height:1; padding:10px 0 5px 5px;}