Title: PHPで記述したCSSがうまく反映されない
Last modified: 2016年10月3日

---

# PHPで記述したCSSがうまく反映されない

 *  解決済 [spacebros](https://ja.wordpress.org/support/users/spacebros/)
 * (@spacebros)
 * [10年、 6ヶ月前](https://ja.wordpress.org/support/topic/php%e3%81%a7%e8%a8%98%e8%bf%b0%e3%81%97%e3%81%9fcss%e3%81%8c%e3%81%86%e3%81%be%e3%81%8f%e5%8f%8d%e6%98%a0%e3%81%95%e3%82%8c%e3%81%aa%e3%81%84/)
 * お世話になります。
 * function.phpに
    `wp_enqueue_style( 'cssphp',get_template_directory_uri(). '/css/
   css.php' );` と記述し、読み込んだphpファイルをCSSとして利用しています。
 * 入力フォームのvalueによってCSSを変化させたいのですが、入力値を変えても前のCSS
   が有効になっており最新のものがうまく反映されずに困っています。
 * 解決方法をご教示ください、よろしくお願い致します。

15件の返信を表示中 - 1 - 15件目 (全22件中)

1 [2](https://ja.wordpress.org/support/topic/php%e3%81%a7%e8%a8%98%e8%bf%b0%e3%81%97%e3%81%9fcss%e3%81%8c%e3%81%86%e3%81%be%e3%81%8f%e5%8f%8d%e6%98%a0%e3%81%95%e3%82%8c%e3%81%aa%e3%81%84/page/2/?output_format=md)
[→](https://ja.wordpress.org/support/topic/php%e3%81%a7%e8%a8%98%e8%bf%b0%e3%81%97%e3%81%9fcss%e3%81%8c%e3%81%86%e3%81%be%e3%81%8f%e5%8f%8d%e6%98%a0%e3%81%95%e3%82%8c%e3%81%aa%e3%81%84/page/2/?output_format=md)

 *  [nobita](https://ja.wordpress.org/support/users/nobita/)
 * (@nobita)
 * [10年、 6ヶ月前](https://ja.wordpress.org/support/topic/php%e3%81%a7%e8%a8%98%e8%bf%b0%e3%81%97%e3%81%9fcss%e3%81%8c%e3%81%86%e3%81%be%e3%81%8f%e5%8f%8d%e6%98%a0%e3%81%95%e3%82%8c%e3%81%aa%e3%81%84/#post-182446)
 * こんにちは、
 * > 入力フォームのvalueによってCSSを変化させたい
 * 自分のサイトの例で恐縮ですが、
 * [http://www.tenman.info/wp3/raindrops/2016/03/27/raindrops1-356-%E3%82%B9%E3%83%86%E3%82%A3%E3%82%AD%E3%83%BC%E3%83%A1%E3%83%8B%E3%83%A5%E3%83%BC%E3%82%B5%E3%83%9D%E3%83%BC%E3%83%88/](http://www.tenman.info/wp3/raindrops/2016/03/27/raindrops1-356-%E3%82%B9%E3%83%86%E3%82%A3%E3%82%AD%E3%83%BC%E3%83%A1%E3%83%8B%E3%83%A5%E3%83%BC%E3%82%B5%E3%83%9D%E3%83%BC%E3%83%88/)
 * コメントフォームに、正しいメールアドレスを入力したら、フィールドのボーターの色
   が変わる
 * そういった感じの事をしたいという事ですか？
 *  トピック投稿者 [spacebros](https://ja.wordpress.org/support/users/spacebros/)
 * (@spacebros)
 * [10年、 6ヶ月前](https://ja.wordpress.org/support/topic/php%e3%81%a7%e8%a8%98%e8%bf%b0%e3%81%97%e3%81%9fcss%e3%81%8c%e3%81%86%e3%81%be%e3%81%8f%e5%8f%8d%e6%98%a0%e3%81%95%e3%82%8c%e3%81%aa%e3%81%84/#post-182447)
 * 投稿ありがとうございます。
 * フォーム作成のためのプラグインを使っているのですが、入力がなかった項目に関して
   は
    `display:<?PHP if(!isset$〇〇){echo "none";}else{echo "";} ?>;` のようにし
   て確認画面で表示させないようにしたいと考えているのですが、変数が変わってもCSS
   が変わらずに困っています。
 * フォーム作成用のプラグインはMW WP Formを利用しているのですが、過去の参考に出来
   そうな投稿を読んだところ、安全性の面でCSSで制御したほうがいいということでした
   ので、上記のような方法を使おうと考え、こちらにてご質問させて頂きました。
 * よろしくお願い致します。
 *  [nobita](https://ja.wordpress.org/support/users/nobita/)
 * (@nobita)
 * [10年、 6ヶ月前](https://ja.wordpress.org/support/topic/php%e3%81%a7%e8%a8%98%e8%bf%b0%e3%81%97%e3%81%9fcss%e3%81%8c%e3%81%86%e3%81%be%e3%81%8f%e5%8f%8d%e6%98%a0%e3%81%95%e3%82%8c%e3%81%aa%e3%81%84/#post-182454)
 * 確認画面なんですね
 * PHPを使わなくても、CSSでもできそうな気がしますが
 * [http://zero.css-happylife.com/selectors/empty.shtml](http://zero.css-happylife.com/selectors/empty.shtml)
 * プラグインの日付のプリビューを見たところ、プリビューはタグ付けされていないみたい
   なので、タグ付けのためのカスタマイズ方法があれば別ですが、難しそうな印象でした。
 *  トピック投稿者 [spacebros](https://ja.wordpress.org/support/users/spacebros/)
 * (@spacebros)
 * [10年、 6ヶ月前](https://ja.wordpress.org/support/topic/php%e3%81%a7%e8%a8%98%e8%bf%b0%e3%81%97%e3%81%9fcss%e3%81%8c%e3%81%86%e3%81%be%e3%81%8f%e5%8f%8d%e6%98%a0%e3%81%95%e3%82%8c%e3%81%aa%e3%81%84/#post-182456)
 * ご回答ありがとうございます。
    ご教示頂いたサイトを参考にして table td:empty {
   display: none; } というふうにすればいいという事でしょうか？
 * 例えばなのですが、
 * ——————————–
    |好きなお菓子|　　 　| ——————————–
 * のようにしていて、そこに入力がなかった場合、
    「好きなお菓子」という項目も含め
   て、 trのclass{display:none;} として、非表示にしたりですとか、別の項目では非表示
   以外のCSSも使いたいと考えています。
 *  トピック投稿者 [spacebros](https://ja.wordpress.org/support/users/spacebros/)
 * (@spacebros)
 * [10年、 6ヶ月前](https://ja.wordpress.org/support/topic/php%e3%81%a7%e8%a8%98%e8%bf%b0%e3%81%97%e3%81%9fcss%e3%81%8c%e3%81%86%e3%81%be%e3%81%8f%e5%8f%8d%e6%98%a0%e3%81%95%e3%82%8c%e3%81%aa%e3%81%84/#post-182457)
 * 追記：
 * $〇〇に値を入れても入れなくても
 * display:none !important;
 * となっています。試しに
    display:<?PHP if(!isset$〇〇){echo “none”;}else{echo “”;}?
   >; を display:<?PHP if(isset$〇〇){echo “none”;}else{echo “”;} ?>; と、「!」を
   外しても同じく display:none !important; のままです。
 *  [nobita](https://ja.wordpress.org/support/users/nobita/)
 * (@nobita)
 * [10年、 6ヶ月前](https://ja.wordpress.org/support/topic/php%e3%81%a7%e8%a8%98%e8%bf%b0%e3%81%97%e3%81%9fcss%e3%81%8c%e3%81%86%e3%81%be%e3%81%8f%e5%8f%8d%e6%98%a0%e3%81%95%e3%82%8c%e3%81%aa%e3%81%84/#post-182460)
 * まずは、確認画面のhtmlソースを書いてください
    それと、htmlソースに対応するスタイル
   も、かいてください
 * ソースがわからないと、スタイルの事とかはなんとも言えないので、、、
 *  トピック投稿者 [spacebros](https://ja.wordpress.org/support/users/spacebros/)
 * (@spacebros)
 * [10年、 6ヶ月前](https://ja.wordpress.org/support/topic/php%e3%81%a7%e8%a8%98%e8%bf%b0%e3%81%97%e3%81%9fcss%e3%81%8c%e3%81%86%e3%81%be%e3%81%8f%e5%8f%8d%e6%98%a0%e3%81%95%e3%82%8c%e3%81%aa%e3%81%84/#post-182464)
 * ご回答ありがとうございます
 * 入力画面
 *     ```
       <tr class="nodisp">
       <td>好きなお菓子</td>
       <td><input type="text" name="man3" id="man3" size="60" value="" placeholder="全角でご入力ください" /></td>
       </tr>
       ```
   
 * 確認画面
 *     ```
       <tr class="nodisp">
       <td>好きなお菓子</td>
       <td>aaa<input type="hidden" name="man3" value="aaa" /></td>
       </tr>
       ```
   
 * です。
 * 追加で読み込ませている、css.phpは
 *     ```
       <?php
         header('Content-Type: text/css; charset=utf-8');
       ?>
       @charset "UTF-8";
   
       .mw_wp_form_confirm .nodisp {
           display:<?PHP if($_SESSION['man3']==""){echo "none !important";}else{echo "";}?>;
       }
       ```
   
 * です。
    $_SESSION[‘man3’]をechoで表示させて値を確認しているのですが、そこは正常
   に入力値によって変化しています。 よろしくお願い致します。
 *  [nobita](https://ja.wordpress.org/support/users/nobita/)
 * (@nobita)
 * [10年、 6ヶ月前](https://ja.wordpress.org/support/topic/php%e3%81%a7%e8%a8%98%e8%bf%b0%e3%81%97%e3%81%9fcss%e3%81%8c%e3%81%86%e3%81%be%e3%81%8f%e5%8f%8d%e6%98%a0%e3%81%95%e3%82%8c%e3%81%aa%e3%81%84/#post-182466)
 * プラグインを使っていないので、もっといい方法があるとは思いますが、
 * CSSと、若干のプラグインのコード修正で、可能と言えば、可能でした。
 * class.text.php
    チョットだけ変更
 *     ```
       /**
       	 * confirm_page
       	 * 確認ページでのフォーム項目を返す
       	 * @return string HTML
       	 */
       	protected function confirm_page() {
       		$value = $this->Data->get_raw( $this->atts['name'] );
       		$_ret  = '<p class="preview">'.esc_html( $value ).'</p>';
       		$_ret .= $this->Form->hidden( $this->atts['name'], $value );
       		return $_ret;
       	}
       ```
   
 * `$_ret = '<p class="preview">'.esc_html( $value ).'</p>';`　P要素追加
 *     ```
       [mwform_text name="like" id="like" class="love"]
       [mwform_submitButton name="kakunin" class="kakunin" confirm_value="確認" submit_value="送信"]
       ```
   
 * ソース　確認画面（何も入力しない場合）
 *     ```
       <form method="post" action="" enctype="multipart/form-data">
       <p></p>
       <p class="preview"></p>
       <input type="hidden" name="like" value=""><br>
       <input type="submit" name="kakunin" value="送信" class="kakunin"><p></p>
       <input type="hidden" id="token" name="token" value="****"><input type="hidden" name="_wp_http_referer" value="/wp/archives/29216"></form>
       ```
   
 * CSS
 *     ```
       .preview:empty ~.kakunin{
           display:none;
       }
       ```
   
 * で、`<p class="preview"></p>`が空の場合、submitボタンを非表示にできました。
 *  トピック投稿者 [spacebros](https://ja.wordpress.org/support/users/spacebros/)
 * (@spacebros)
 * [10年、 6ヶ月前](https://ja.wordpress.org/support/topic/php%e3%81%a7%e8%a8%98%e8%bf%b0%e3%81%97%e3%81%9fcss%e3%81%8c%e3%81%86%e3%81%be%e3%81%8f%e5%8f%8d%e6%98%a0%e3%81%95%e3%82%8c%e3%81%aa%e3%81%84/#post-182471)
 * ご回答ありがとうございます。
 * せっかく沢山のコードを書いてくださったのですが、私の知識が足りないためどうして
   いいか分からない状態です。
 * すいません。
 * プラグインをそのまま利用して、私のcss.phpを修正して問題を解決するのは不可能で
   しょうか？
 *  [nobita](https://ja.wordpress.org/support/users/nobita/)
 * (@nobita)
 * [10年、 6ヶ月前](https://ja.wordpress.org/support/topic/php%e3%81%a7%e8%a8%98%e8%bf%b0%e3%81%97%e3%81%9fcss%e3%81%8c%e3%81%86%e3%81%be%e3%81%8f%e5%8f%8d%e6%98%a0%e3%81%95%e3%82%8c%e3%81%aa%e3%81%84/#post-182484)
 * > プラグインをそのまま利用して、私のcss.phpを修正して問題を解決するのは不可能
   > でしょうか？
 * そういった意味ではありません。
    単にCSSだけでコントロールできるんじゃないかという
   興味から書いただけです
 *     ```
       $_SESSION['man3']をechoで表示させて値を確認しているのですが、そこは正常に入力値によって変化しています。
       ```
   
 * なら、CSSの指定が、他のCSSの指定で上書きされていないか、チェック済みですか？
 * 例えば、以下の指定をしているとのことですが、第三引数のスタイルの依存関係が指定
   されていませんが、、、
 * 詰まる所、htmlソースのヘッダーでスタイルシートが正しい順で呼び出されているかどうか
   は、確認済みですか？
 * css.phpは、動的にスタイルが変化しますが、CSSは通常キャッシュされますよね
    キャッシュ
   されていて、スタイルが変わらない事もありそうですね
 *     ```
       wp_enqueue_style( 'cssphp',get_template_directory_uri(). '/css/css.php' );
       ```
   
 * > [Home](https://developer.wordpress.org/)
 * サイトは確認できますか？
 * > せっかく沢山のコードを書いてくださったのですが、私の知識が足りないためどうして
   > いいか分からない状態です。
 * ごめんなさいね　忘れてくださーい
 *  モデレーター [まーちゅう](https://ja.wordpress.org/support/users/rocketmartue/)
 * (@rocketmartue)
 * [10年、 6ヶ月前](https://ja.wordpress.org/support/topic/php%e3%81%a7%e8%a8%98%e8%bf%b0%e3%81%97%e3%81%9fcss%e3%81%8c%e3%81%86%e3%81%be%e3%81%8f%e5%8f%8d%e6%98%a0%e3%81%95%e3%82%8c%e3%81%aa%e3%81%84/#post-182509)
 * phpではなくて、jsで表示/非表示を切り替えてはどうでしょうか？
 *     ```
       <script type="text/javascript">
       	window.onload = function () {
       		input_1 = document.forms[0].man3.value
       		if(input_1 == ""){
       			$('.mw_wp_form_preview .nodisp').css('display','none');
       		}
       		else {
       			$('.mw_wp_form_preview .nodisp').css('display','block');
       		}
       	}
       </script>
       ```
   
 * フォームを表示させているテンプレートファイルに追記してみてください。
 *  トピック投稿者 [spacebros](https://ja.wordpress.org/support/users/spacebros/)
 * (@spacebros)
 * [10年、 6ヶ月前](https://ja.wordpress.org/support/topic/php%e3%81%a7%e8%a8%98%e8%bf%b0%e3%81%97%e3%81%9fcss%e3%81%8c%e3%81%86%e3%81%be%e3%81%8f%e5%8f%8d%e6%98%a0%e3%81%95%e3%82%8c%e3%81%aa%e3%81%84/#post-182521)
 * nobita 様
 * ご回答ありがとうございます。
    遅くなってすいません。
 * ①「CSSの指定が、他のCSSの指定で上書きされていないか」
    については、 「!important」
   を付けているから最優先されると思っているのですがどうでしょう？
 * ②「htmlソースのヘッダーでスタイルシートが正しい順で呼び出されているかどうか」
   
   すいません、まったく意識せずに呼び出していました。
 *  トピック投稿者 [spacebros](https://ja.wordpress.org/support/users/spacebros/)
 * (@spacebros)
 * [10年、 6ヶ月前](https://ja.wordpress.org/support/topic/php%e3%81%a7%e8%a8%98%e8%bf%b0%e3%81%97%e3%81%9fcss%e3%81%8c%e3%81%86%e3%81%be%e3%81%8f%e5%8f%8d%e6%98%a0%e3%81%95%e3%82%8c%e3%81%aa%e3%81%84/#post-182522)
 * RocketMartue　様
 * ご回答ありがとうございます。
    jsでの表示/非表示という方法があるのですね。
 * 「フォームを表示させているテンプレートファイルに追記」
    というのはどのようにす
   ればいいのでしょうか？
 *  モデレーター [まーちゅう](https://ja.wordpress.org/support/users/rocketmartue/)
 * (@rocketmartue)
 * [10年、 6ヶ月前](https://ja.wordpress.org/support/topic/php%e3%81%a7%e8%a8%98%e8%bf%b0%e3%81%97%e3%81%9fcss%e3%81%8c%e3%81%86%e3%81%be%e3%81%8f%e5%8f%8d%e6%98%a0%e3%81%95%e3%82%8c%e3%81%aa%e3%81%84/#post-182531)
 * 「フォームを表示させているテンプレートファイル」
    通常は、page.phpですが、上記
   のコードをそのまま貼り付ければOKです。
 *  [nobita](https://ja.wordpress.org/support/users/nobita/)
 * (@nobita)
 * [10年、 6ヶ月前](https://ja.wordpress.org/support/topic/php%e3%81%a7%e8%a8%98%e8%bf%b0%e3%81%97%e3%81%9fcss%e3%81%8c%e3%81%86%e3%81%be%e3%81%8f%e5%8f%8d%e6%98%a0%e3%81%95%e3%82%8c%e3%81%aa%e3%81%84/#post-182550)
 * > 「!important」を付けているから最優先されると思っているのですがどうでしょう？
 * 一般的には、そうですけど、それが適用できないという事ですよね
 * !important がついているから、最優先とは限りません。上書きは可能です。
 * inline style　で、!importantつけているわけではないですよね？
 * > ②「htmlソースのヘッダーでスタイルシートが正しい順で呼び出されているかどうか」
   > 
   > すいません、まったく意識せずに呼び出していました。
 * と言われても何とも言えないですが、　自分が出来ると思って行った作業がなぜできない
   のか、にこだわらないなら、
 * ＠RocketMartue　さんの方法を試すのが一番近道ではないかと思います。

15件の返信を表示中 - 1 - 15件目 (全22件中)

1 [2](https://ja.wordpress.org/support/topic/php%e3%81%a7%e8%a8%98%e8%bf%b0%e3%81%97%e3%81%9fcss%e3%81%8c%e3%81%86%e3%81%be%e3%81%8f%e5%8f%8d%e6%98%a0%e3%81%95%e3%82%8c%e3%81%aa%e3%81%84/page/2/?output_format=md)
[→](https://ja.wordpress.org/support/topic/php%e3%81%a7%e8%a8%98%e8%bf%b0%e3%81%97%e3%81%9fcss%e3%81%8c%e3%81%86%e3%81%be%e3%81%8f%e5%8f%8d%e6%98%a0%e3%81%95%e3%82%8c%e3%81%aa%e3%81%84/page/2/?output_format=md)

 トピック「PHPで記述したCSSがうまく反映されない」には新たに返信することはできません。

## タグ

 * [CSS](https://ja.wordpress.org/support/topic-tag/css/)
 * [MW WP Form](https://ja.wordpress.org/support/topic-tag/mw-wp-form/)

 * フォーラム: [使い方全般](https://ja.wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 22件の返信
 * 3人の参加者
 * 最後の返信者: [spacebros](https://ja.wordpress.org/support/users/spacebros/)
 * 最後の活動: [10年、 6ヶ月前](https://ja.wordpress.org/support/topic/php%e3%81%a7%e8%a8%98%e8%bf%b0%e3%81%97%e3%81%9fcss%e3%81%8c%e3%81%86%e3%81%be%e3%81%8f%e5%8f%8d%e6%98%a0%e3%81%95%e3%82%8c%e3%81%aa%e3%81%84/page/2/#post-182598)
 * 状態: 解決済

## トピック

### 人気のトピック

### 返信がないトピック

### サポート関連ではないトピック

### 解決済みのトピック

### 未解決のトピック

### すべてのトピック
