Shopping/以下
ナビゲーションに移動
検索に移動
新規作成
適用範囲:/shopping/以下、タカシマヤ特集などの新規静的ページ。
import
1)import.cssに最低限読み込むCSS
例:
@charset "shift-jis";
/*-------------------------------------------------------
タカシマヤ オンラインショッピング
サンプル importCSS
--------------------------------------------------------*/
/* サイト全体のCSSデフォルト値 */
@import url("/shopping/common/css/default.css");
@import url("/css/import_global.css");
/* サイト全体の共通設定 */
@import url("/shopping/common/css/contents_base.css");
/*ページを構成する同フォルダ内CSS*/
@import url("baseとか.css");
必須なもの説明:
| /shopping/common/css/default.css | →本当に基本的な設定 |
| /css/import_global.css | →ヘッダー系 |
| /shopping/common/css/contents_base.css | →パンクズやリストなどの設定 |
※よくimportに下記が混ざっていますが
/*右メニュー用共通設定*/
@import url("../../../../../shopping/common/css/sub_contents.css");
/*大カテ用共通設定*/
@import url("/shopping/first_category/css/first_base.css");
右メニュー用は大カテindexなど、
大カテ用はパンクズのないページ(バレンタインデーなど)に必要です。
例外もあるので適宜確認してください。
link rel
2)ページにリンクで読み込むCSS&JS
例:
<head> <link rel="stylesheet" type="text/css" href="同フォルダのimport.css"> <script type="text/javascript" src="/js/default.js"></script> <script type="text/javascript" src="/common/script.js"></script> </head>
クラス
3)共通のID、クラス名
ID(container)
#container {contents_base.css (line 8)
margin:0pt auto;
text-align:left;
width:750px;
}
ID(contents-area)
#contents-area {contents_base.css (line 13)
font-size:small;
line-height:130%;
margin-bottom:30px;
}
ID(main-contents)…右メニューありの場合使用
#contents-area #main-contents {contents_base.css (line 20)
float:left;
width:548px;
}
デザインによって幅が違う場合などは新しいdivで指定をする。