[
自宅サーバーWebRing
┃
前
|ID=54
前後5表示
|
次
┃
乱移動
|
サイト一覧
]
このサイト内
書籍 DVD CD
Google(日本語)
Google(Web全体)
Google(イメージ)
Google(キャッシュ)
Yahoo! JAPAN
goo 英和
goo 和英
goo 国語
goo 新語
サイトマップ
リンク集
ダウンロード
フォーラム
Users Wiki
最新情報
TOP
»
xpwiki
» スタイルシートについて - バックアップ No.9 を復元して編集
|
新規
下位
一覧
検索
最新
ヘルプ
ページへ戻る
編集
複製
履歴
添付
Note
リンク元
印刷
スタイルシートについて
- バックアップ No.9 を復元して編集
xpwiki
:
スタイルシートについて
- バックアップ No.9 を復元して編集
スタイルシートについて の編集
詳細な入力項目を表示
ページタイトル
( 空白で自動設定 )
:
ページ頭文字読み:
ページ並び順
( 0-9 小数可 標準:1 )
:
ページ別名
(複数は[
改行
]で区切る)
:
ページ内容:
* スタイルシートについて [#ua97f3ce] このページは、Ver 3.43 以降の xpWiki について書かれています。Ver 3.42 以前については以下のページをご覧ください。 #ls2(,pagename,reverse) #contents ** 必ず読み込まれる CSS (main.css) [#c2c74035] xpWiki では、デフォルトの表示状態(defaultスキン)でのCSSをXOOPS_TRUST_PATH 側に持っています。ただ、CSSを独自にカスタマイズした場合に、バージョンアップするとカスタマイズした分が元に戻ってしまいます。 それでは具合が悪いので、スタイルシート(CSS)のオーバーライト(上書き)を取り入れています。 xpWikiが読み込むCSSの実体は、&br; XOOPS_TRUST_PATH/modules/xpwiki/skin/css&br; ディレクトリにあります。 ページを表示する場合に必ず読み込まれる CSS は main.css (media="all") と main_print.css (media="print") です。 この main.css を上書きするためには、&br; XOOPS_ROOT_PATH(html側)/modules/[インストールディレクトリ]/skin/css ディレクトリに、main.css というファイル名でアップロードします。 さらに、スキンにより上書きすることができます。そのためには、&br; XOOPS_ROOT_PATH(html側)/modules/[インストールディレクトリ]/skin/[スキン名] ディレクトリに、main.css というファイル名でアップロードします。 まとめると、デフォルトのスキン「default」における main.css の読み込み順は次のようになります。 + XOOPS_TRUST_PATH/modules/xpwiki/skin/css/main.css + XOOPS_ROOT_PATH/modules/[インストールディレクトリ]/skin/css/main.css + XOOPS_ROOT_PATH/modules/[インストールディレクトリ]/skin/default/main.css 次に、例えば<h>タグの色を #9acd32(yellowgreen) に変えたい場合について説明します。 次の内容の main.css を スキンに関わらず適用したい場合は、&br; "XOOPS_ROOT_PATH/modules/[インストールディレクトリ]/skin/css/"&br; にアップロードし、default スキンにのみ適用したい場合は、&br; "XOOPS_ROOT_PATH/modules/[インストールディレクトリ]/skin/default/"&br; にアップロードします。 #code(css){{ $class h1, $class h2 { background-color:#9ACD32; } $class h3 { border-bottom: 3px solid #9ACD32; border-top: 1px solid #9ACD32; border-left: 10px solid #9ACD32; border-right: 5px solid #9ACD32; } $class h4 { border-left: 18px solid #9ACD32; } }} $class は、モジュールディレクトリ名にあわせたクラスセレクタ文字列に置換されます。(モジュールディレクトリ名が xpwiki ならば、"div.xpwiki_xpwiki") ちなみに、このサイトの xpWiki の カスタマイズ CSS は、http://xoops.hypweb.net/modules/xpwiki/skin/css/main.css こんな感じです。 ** プラグインが使用するCSS [#i8f2a9b2] プラグインが独自にCSSを読み込んでいる場合があります。そのCSSのオーバーライト方法について説明します。 プラグインが独自に読み込むスタイルシートも、&br; XOOPS_TRUST_PATH/modules/xpwiki/skin/css &br; ディレクトリにあります。基本的に プラグイン名.css となっています。 これらのCSSも main.css と同様に上書きすることができます。 ** ページ毎のスタイルシート [#w72894c1] 各ページにファイル名 style.css として、CSSファイルを添付することで、特定のスタイルシートをそのページに適用することができます。 また、下層ページにもそのスタイルシートが適用(継承)されます。 このページには以下のスタイルシートが添付されています。 #code(css){{ $class div.body { background : url(../image/HowToCSS.gif) no-repeat fixed right 200px ; } }} ** ブロック表示およびレンダラー用のスタイルシート [#k436b564] ブロック表示やレンダラーモードでのみ特定のCSSを適用したい場合もあると思います。 読み込むCSSのファイル名にブロックモードは _block 、レンダラーモードは _render を付け加えたCSSファイルを main.css と同様に配置します。 main.css の場合、ブロック表示用が main_block.css レンダラー用が main_render.css となります。 ** CSS内での相対パスについて [#s5749543] 背景画像などに、URLを指定したい場合に相対パスを使う場合は、XOOPS_URL/modules/[DirName]/skin/loader.php が 自己CSS のパスになりますので、この位置から計算して相対パスを指定する必要があります。
編集の要約:
Q & A 認証:
ページ更新時は次の質問にお答えください。(プレビュー時は必要ありません)
Q:
「大阪」の読みがな?(ひらがなで)
A:
お名前:
タイムスタンプを変更しない
テキスト整形のルールを表示する
添付ファイル
:
ぺージ情報
ぺージ名 :
スタイルシートについて
ページ別名 :
未設定
ページオーナー :
nao-pon
閲覧可
グループ :
すべての訪問者
ユーザー :
すべての訪問者
編集可
グループ :
すべての訪問者
ユーザー :
すべての訪問者
Counter: 549, today: 1, yesterday: 0
メインメニュー
ホーム
価格比較 百貨
UsersWiki
xpwiki
新規ページ作成
最新ページ一覧
全ページ一覧
人気のページ
全コメント一覧
xpWikiフォーラム
スキン選択
ヘルプ
» 関連ページ
» 編集する
» 変更点を見る
» バックアップ一覧
» 添付ファイル一覧
» リンク元一覧
お問い合わせ
ファイルマネージャー
ログイン
ユーザー名:
パスワード:
パスワード紛失
|
新規登録
オンライン状況
487 人のユーザが現在オンラインです。 (3 人のユーザが xpwiki を参照しています。)
登録ユーザ: 0
ゲスト: 487
もっと...
サイト情報