REFERENCE

共通で使う

css_common.css

リセット、色設定などのPC／スマホ共通で使うcssファイル。一部ファイル内でmedia属性によるPC・タブレット・スマホの切り分け有り

css_column.css

コラム設定のcss定義。ファイル内でmedia属性によるPC・タブレット・スマホの切り分け有り

css_caption.css

見出しテキストの設定cssファイル。ファイル内でmedia属性によるPC・タブレット・スマホの切り分け有り

css_form.css

フォーム用部品。必要がないケースもあるのでcss_common.cssから外してある。

css_pages.css

各ページで使う定義css。media属性による切り分けあり。記載量が多いページは別途cssファイルを用意する場合もあり。

PC向けセット

css_pc_import.css

インポートファイル。

css_pc_layout.css

レイアウトとページをまたぐ共通定義を決めるcssファイル

css_pc_pages.css

個別ページで使うcssファイル

スマホ向けセット

css_m_import.css

インポートファイル。

css_m_layout.css

役割はPC用と同じ。

css_m_pages.css

役割はPC用と同じ。

タブレット向けセット

css_t_import.css

インポートファイル。

css_t_layout.css

役割はPC用と同じ。

css_t_pages.css

役割はPC用と同じ。

フォルダ構造

index.html
　┣common
　┃　┣ css … 各種cssファイル（※1）
　┃　┣ img
　┃　┃　┣ common … 共通要素（リンクアイコンとか）
　┃　┃　┣ layout … レイアウトで使う
　┃　┃　┗ page_image … 各ページで使う画像（※2）
　┃　┗js
　┃
　┣ page_dir … コンテンツごとにフォルダ
　┃　┣ img
　┃　┣ css
　┃　┣ index.html
　┃　┣ indexA.html
　┃　┗ indexB.html


※1 cssファイルはwordpressに移植を考え、頭にcss_を付ける
※2 wpでは1フォルダに画像を納めるので、画像ファイル名はすべてユニークであることを心がける。
なおwpに移植しない場合はコンテンツごとのフォルダ/imgに画像を納める。