web-dev-qa-db-ja.com

画面解像度を調整する

すべての画面解像度に合わせて本体を調整しようとしています。私はJoomlaを使用してWebサイトを開発しています。ご存知のように、独自のCSSを備えたデフォルトのテンプレートがあります。次に、同じタグ（たとえば、ul、liなど）のために、別のCSSファイルを必要とする記事をいくつか作成しました。コンポーネントのようなテンプレートを設定する必要があります（最後に「tmpl = component」を付けるだけです） URLの）。残念ながら、これらの記事の本文を編集したい場合はできません。実はbodyタグは「body contentpane」になっていて、まったく違います。私は2つの異なる方法を試しました。最初に、すべての記事に特定のテンプレートを設定しましたが、機能しませんでした。だから空のテンプレートを挿入してみたのですが、細かい設定はなかなか難しいと思います。

articlescss
2
user2348092

テンプレートが正しく設定されている場合、メニュー項目にページクラスを追加すると、それがボディクラスとしてページに追加されます。したがって、テンプレートに追加のcssを追加して、body.yourpageclassをプレフィックスとして付けることができます。これにより、メニュー項目にそのクラスがあるページにのみロードされます。

次に例を示します。 Customized Trip Page

これと他の旅行ページは、trip-pageと呼ばれるページクラスを使用します（ソースを表示すると確認できます）。

私はこのようなものを使用しました：

body.trip-page .box3.nohover .rt-block {background-image: url(../../../images/IMT/trip-page-overlay-plane.png);}

あなたのコードはこれとは異なりますが、その.rt-blockは記事のコンテンツボックスであり、私は旅行ページでのみカスタム背景を望んでいました。

これを行う別の方法もあります。それは、独自のテンプレートをコーディングして、ページのそのbodyタグにユニークなものがあるようにすることです。 Rocketテーマは、実際にはテンプレートのスイッチでこれを行います。理論的にはテンプレートを変更して、記事のカテゴリが上部のbodyタグに読み込まれるようにして、カテゴリ全体でカスタムCSSを使用できるようにすることができます。

2
Brian Peat

CSSの特定のターゲットを作成するには、さまざまなページ変数をbody要素のクラスにエコーして、スタイルのターゲットにする非常に特定のcssフックを提供できます。

Index.phpの上部：

<?php
$app = JFactory::getApplication();
// Detect the active variables
$option   = $app->input->getCmd('option', '');
$view     = $app->input->getCmd('view', '');
$layout   = $app->input->getCmd('layout', '');
$itemid   = $app->input->getCmd('Itemid', '');
?>

そしてbodyタグに：

<body class="<?php echo $option . " view-" . $view . " layout-" . $layout. " itemid-" . $itemid . "";?>">

もちろん、画面の解像度に基づいてbody要素を調整するためにこれを行う必要はありません。CSSで必要なのは、@ media-queriesだけです。

1
Seth Warburton

Joomlaには、すべてのサイトにページクラスをアタッチする機能があります。 Joomlaメニューマネージャーに移動し、メニューポイントを開きます。次に、「ページクラスサフィックス」設定を検索し、「flat-article-layout」のような独自のcssクラスを配置します。次に、このクラスを使用して、この特定のページをCSSで次のように設計できます。

.falt-article-layout ul li {list-style：none;}

または、テンプレートのオーバーライドを試してください：

http://docs.joomla.org/How_to_override_the_output_from_the_Joomla!_core

1
Joomla Agency

ファイル/templates/your_template/index.phpでは、bodyタグを調整して必要なクラスを追加できます。メディアクエリでは、画面の解像度に基づいて調整できます。

https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries

?tmpl=componentを追加してさまざまなページに異なるレイアウトが必要な場合は、同じディレクトリ（または一致する限り任意の名前）にファイルcomponent.phpを作成して、そのレイアウトを調整できます。

1
Jordan Ramstad

"tmpl = component"を使用することで、OR "tmpl = my_new_template_name"を使用して、ファイルをディレクトリ/ templates/system/my_new_template_name。 php。「tmpl = component」を使用している場合は、必要に応じて/ templates/system/component.phpを変更できます。詳細なガイダンスが必要な場合はお知らせください。

0
Pramod Kumar