質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.35%
WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

0回答

1064閲覧

front-page-phpにかけているコードが機能しない

退会済みユーザー

退会済みユーザー

総合スコア0

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2020/09/24 11:58

front-page.phpにかけているcssが機能しないです。
下のコードがfooterphpです。
header.phpにかけているcssは機能します。
原因が全くわかりません

php

1<footer> 2 <div class="left-footer"> 3 4 <div class="footer-list"> 5 <h1>PADIダイビングショップ<span>SEA</span></h1> 6 <p>PADI DIVINGSHOP SEA</p> 7 </div> 8 <div class="footer-list2"> 9 <div class="footer-list2-title"> 10 <p>【岩槻本社】</p> 11 <p>【久喜事務所】</p> 12 </div> 13 <div class="footer-list2-title2"> 14 <p>〒346-0011</p> 15 <p>〒346-0011</p> 16 </div> 17 <div class="footer-list2-title3"> 18 <p>埼玉県さいたま市岩槻区大字末田1500-1</p> 19 <p>埼玉県久喜市青毛3丁目</P> 20 </div> 21 </div> 22 </div> 23 <div class="footer-list3"> 24 <div class="footer-list3-title4"> 25 <div class="footer-list3-logo"> 26 <img src="<?php echo get_template_directory_uri(); 27 ?>/img/受話器.png" alt=""> 28 </div> 29 <div class="footer-list3-logo2"> 30 <h1>048-791-7103</h1> 31 </div> 32 </div> 33 <div class="footer-list3-img"> 34 <div class="footer-list3-sentence1"> 35 <p><営業時間></p> 36 <p>土日祝日</p> 37 <p>9:30~17:30</p> 38 </div> 39 <div class="footer-list3-sentence2"> 40 <p>*営業時間外にお問合せの場合</p> 41 <p>E-mail →→→ info@ceg.jp</p> 42 </div> 43 </div> 44 </div> 45</footer>

style.css

1footer{ 2 background:#dbedf0; 3 color: blue; 4 padding-top: 20px; 5 font-family: sans-serif; 6 text-align: center; 7 } 8 @media screen and (max-width: 768px){ 9 footer{ 10 margin-top: 20px; 11 } 12} 13.main-footer{ 14 position: relative; 15 width: 100%; 16 background:#dbedf0; 17 color: blue; 18 padding-top: 20px; 19 font-family: sans-serif; 20 text-align: center; 21} 22@media screen and (max-width: 768px){ 23 .main-footer{ 24 top: 10px; 25 } 26} 27.left-footer,.footer-list3{ 28 display: inline-block; 29} 30.left-footer{ 31 margin-right: 50px; 32} 33@media screen and (max-width: 768px){ 34 .left-footer{ 35 margin-right:0px; 36 width: 100%; 37 } 38} 39 .footer-list{ 40 text-align: center; 41 } 42 @media screen and (max-width: 768px){ 43 .footer-list{ 44 display: none; 45 } 46} 47 .footer-list h1{ 48 font-size: 20px; 49 } 50 .footer-list span{ 51 font-size: 35px; 52 margin: 0 25px; 53 } 54 .footer-list p{ 55 font-size: 12px; 56 } 57 .footer-list2{ 58 margin-top: 20px; 59 text-align: left; 60 font-size: 14px; 61 } 62 @media screen and (max-width: 768px){ 63 .footer-list2{ 64 margin-top: 0px; 65 } 66 } 67 .footer-list2-title,.footer-list2-title2,.footer-list2-title3{ 68 display: inline-block; 69 margin: 0px 20px; 70 } 71 @media screen and (max-width: 768px){ 72 .footer-list2-title3{ 73 display: block; 74 } 75 .footer-list2-title{ 76 float: left; 77 width: 45%; 78 margin: 0px; 79 margin-left: 5%; 80 } 81 .footer-list2-title2{ 82 text-align: right; 83 width: 45%; 84 margin: 0px; 85 margin-right: 5%; 86 } 87 .footer-list2-title3{ 88 text-align: center; 89 margin-top: 20px; 90 } 91 } 92 .footer-list3{ 93 margin-left: 50px; 94 } 95 @media screen and (max-width: 768px){ 96 .footer-list3{ 97 margin-left: 0px; 98 } 99 } 100 .footer-list3-logo img{ 101 width: 70px; 102 vertical-align: -25px; 103 transform: rotate(-5deg); 104} 105.footer-list3-logo{ 106 display: inline-block; 107} 108.footer-list3-title4{ 109 color: yellow; 110 text-shadow: black 2px 2px 7px; 111} 112.footer-list3-logo2{ 113 display: inline-block; 114 font-size: 20px; 115} 116.footer-list3-title4{ 117 margin-top: 10px; 118} 119.footer-list3-img{ 120 margin:10px 0px; 121} 122.footer-list3-sentence,.footer-list3-sentence1,.footer-list3-sentence2{ 123 display: flex; 124} 125.footer-list3-sentence p,.footer-list3-sentence1 p,.footer-list3-sentence2 p{ 126 margin: 0px 10px; 127 } 128 @media screen and (max-width: 768px){ 129 .footer-list3-sentence p,.footer-list3-sentence1 p,.footer-list3-sentence2 p{ 130 font-size: 12px; 131 } 132 } 133.footer-list3-sentence{ 134 margin-left: 150px; 135}

試したこと
コードを書き換えました

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

m.ts10806

2020/09/24 12:03

全部でしょうか、一部でしょうか。 もっとコードをシンプルに(HTMLもCSSも)した場合は如何でしょうか。
m.ts10806

2020/09/24 12:04

提示されている内容だけだと再現は難しいので、もっと問題切り分け、明確化をしてください。
退会済みユーザー

退会済みユーザー

2020/09/24 12:05

わかりました。
退会済みユーザー

退会済みユーザー

2020/09/24 12:07

全部のcssが効かないです。 ファイルのパスに問題があるかもしれないので調べてみます。 わざわざ修正依頼して戴きありがとうございます。
m.ts10806

2020/09/24 13:28

質問は編集できますし、ご認識の通り「修正依頼」ですので、質問本文に記載してください。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.35%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問