3

これが一般的な質問である場合はまず申し訳ありませんが、Googleで何も見つけることができず、過度に文書化されていないようです.

現在、自分のグラフィック デザインなどを紹介するポートフォリオを作成しています。見た目は気に入っていますが、他のウェブサイトと比べるとかなり暗いように見えます. 特にナビゲーション バーのテキストもかなり小さいですが、変更したくありません。

代わりに、ページの下部に小さな iOS スタイル スイッチを配置して、クリックすると問題のページの代替バージョン、または別の CSS が適用されたバージョンにユーザーが移動するようにしたいと考えています。次に、背景を明るくしたり、テキストを大きくしたりなどを設定できます。シンプルだが退屈な解決策は、各ページを 4 回作成することです。1 つは大きなフォントと明るい背景、もう 1 つは暗くて小さい、などですが、これは理想的ではありません。もっと似たものを作れないかと思っていました:

portfolio.co.uk/home?light=on&text=big

私が知る限り、動的 URL (と呼ばれていると思います) は PHP のものですが、私は PHP の経験がない人ほど PHP の経験がありません。複雑になりすぎずにこのタスクが可能かどうか、また、定期的な訪問者が毎回好みのバージョンに移動する必要がないように、Cookie を作成する方法さえあるのではないかと考えていました。

ありがとう!

4

3 に答える 3

4

クエリ文字列パラメータを使用して、ロードするスタイルシートを決定します。

基本的に、使用しているテーマに関係なく、常にロードされる一般的なスタイルシートを作成します。次に、テーマ固有のルールを個別のスタイルシートに配置し、PHPifステートメントを使用して、適切なページをロードするために送信するマークアップを決定します。

<head>
    <link href="common.css" rel="stylesheet" type="text/css" />
    <link href="<?php echo $_GET["style"] == "iPhone" ? "iPhone" : "normal" ?>.css" rel="stylesheet" type="text/css" />
   ...
</head>

? :ユーザーがクエリ文字列を変更して間違えた場合にデフォルトを送信する方法が必要なため、クエリ文字列から直接文字列を使用するのではなく、if-check(三項演算子)を使用することに注意してください。使用するテーマが複数ある場合は、switchステートメントを設定し、linkタグで参照する変数に適切なファイル名を保存できます。

$stylesheet = "default";
switch ($_GET["style"]) {
    case "iPhone": $stylesheet = "iPhone";
    case "bigBold": $stylesheet = "bigBold";
}

<link href="<?php echo $stylesheet; ?>.css" rel="stylesheet" type="text/css" />

使い方:

このコードをPHPページに追加するには、スイッチコードをページの上部に配置します(または、さらに良いことに、独自のincludedファイルに配置します。

ページのトップ

次のようにページを設定します。

<?php 
    $stylesheet = "default";
    switch ($_GET["style"]) {
        case "iPhone": $stylesheet = "iPhone";
        case "bigBold": $stylesheet = "bigBold";
    }
?>
<!DOCTYPE html>
<html>
    <head>
        <link href="common.css" rel="stylesheet" type="text/css" />
        <link href="<?php echo $stylesheet; ?>.css" rel="stylesheet" type="text/css" />
       ...
    </head>
    <body>
        ...
    </body>
<html>

includeこのコードは、別のスタイルを使用するすべてのページに追加する必要があるため、このコードをすべてのページに配置できるファイルに分割することをお勧めします。

含まれるファイルとして

名前の付いたファイルを作成し、次のstylesheetSelector.phpコードを追加します。

<?php 
    $stylesheet = "default";
    switch ($_GET["style"]) {
        case "iPhone": $stylesheet = "iPhone";
        case "bigBold": $stylesheet = "bigBold";
    }
?>

次に、PHPページで:

<?php include_once('stylesheetSelector.php'); ?>
<!DOCTYPE html>
<html>
    <head>
        <link href="common.css" rel="stylesheet" type="text/css" />
        <link href="<?php echo $stylesheet; ?>.css" rel="stylesheet" type="text/css" />
       ...
    </head>
    <body>
        ...
    </body>
<html>

すべてのページでこれを実行すると、テーマを追加することにした場合は、stylesheetSelector.phpファイルに情報を追加するだけで、その情報が含まれるすべてincludeのページで利用できるようになります。

警告:これは.phpファイルで行う必要があります。そうでない場合、WebサーバーはPHPを使用して.htmlファイルを処理する必要があります。そうしないと、PHPコードがクリアテキストで表示されます(解釈されません)。

于 2012-06-19T16:44:45.093 に答える
1

クエリ文字列yesに応じてCSSスタイルシートを変更できます...phpでは次のようになります:

if ($_GET['light'] == 'on'){
   echo "<style>something here</style>";
}else {
   echo "<style>something else</style>";
}

$_GET['light']のクエリ文字列値を取得しますlight

于 2012-06-19T16:43:59.523 に答える
1

インクルードphpファイルへの対応。インクルード <'stylesheetSelector.php'> を使用する場合、どのように <> 内にパスを含めますか? サーバーに保存されている別のファイルを使用しているため、ファイルが同じディレクトリにない可能性がありますか?

条件付き css に関するこのリンクを読んで、ブラウザに基づいて選択するよりも、ブラウザの機能を確認する方がよいと述べています。その理由は、ブラウザーの更新機能としてコードを更新または変更する必要がないからです。

http://www.conditional-css.com/

于 2012-07-07T10:32:13.303 に答える