Я отнюдь не веб-разработчик, поэтому простите меня, если я упустил что-то вслепую. Я играю с созданием специальной страницы wordpress php и не могу решить проблему, из-за которой css из моего файла style.css не извлекается для нижнего колонтитула после преобразования из html в php (отлично работает на простом html и css).
Все css из файла style.css работают до тех пор, пока не достигнут нижнего колонтитула, тогда css просто не читается. Кажется, я не вижу явных недостатков в моем CSS или как я вызвал файл footer.php в файле index.php с помощью
Я также попытался отключить все плагины WordPress, не удачи в исправлении моей проблемы.
Любая помощь относительно того, почему мой нижний колонтитул css не вызван, будет очень оценена.
Мой файл header.php:
<!DOCTYPE html> <html lang="en" <?php language_attributes(); ?>> <head> <meta charset="utf-8"> <meta name="vieport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width" /> <!-- ///////////////////////////// Title ///////////////////////////// --> <title> <?php bloginfo('title'); ?> </title> <!-- font-family: 'Antic', sans-serif; --> <link href="https://fonts.googleapis.com/css?family=Antic" rel="stylesheet"> <!-- ////////////////////////////// JavaScript Imports /////////////////// --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <link href="<?php bloginfo('style.css')?>" rel="stylesheet" type="text/css" > <link type="text/css" rel="stylesheet" href="http://www.psldev.co.uk/cedars/wp-content/themes/testfromvid-1/style.css" /> </head> <!-- ////////////////////////////Header ////////////////////////// --> <!-- //////////////////////////// Navigation ////////////////////////// --> <header> <div id="navcontainer" class="navcontainer"> <div id="nav" class="nav"> <ul> <li><a href="index.html">Home </a></li> <li><a href="projects.html"> Projects </a></li> </ul> </div> </div> <!-- //////////////////////////// main Banner ////////////////////////// --> <div class="banner"> <div class="bannerContent"> <div class="mainTitle clearfix animated fadeInDown" id="mainTitle"> <!-- Title --> <h1>Title</h1> <!-- Introductory Paragraph --> <p id="p1" class="p1 animated fadeIn">Established in 1963</p> </div> </div> </div> <!-- //////////////////////////// Banner Content ////////////////////////// --> <div class="mainContentWrap"> </div> </header> Мой файл index.php:
<!-- //////////////////////////// main Body ////////////////////////// --> <?php define( 'WP_USE_THEMES', false); get_header(); ?> <body> <div class="main"> <div class="container3col"> <div class="regbio clearfix"> <div class="theteam"> <div class="teamWrap"> <div class="servicesheader"> <h3>Services</h3> </div> <div class="call-outs-container"> <div class="call-out"> <div class="textcontelem"> <h2>Domestic</h2> <p>Some of the services carried out can include but are not limited to rewiring, new installations, extensions and intruder alarms.</p> </div> </div> <div class="call-out"> <div class="textcontelem"> <h2>Commercial</h2> <p>The services carried out within a commercial environment include shop fittings, alterations and emergency calls.</p> </div> </div> <div class="call-out"> <div class="textcontelem"> <h2>Industrial</h2> <p>Industrial Services include installation and maintenance, emergency breakdowns and emergency lighting.</p> </div> </div> </div> </div> </div> </div> </div> <div class="mainbody"> <div class="bodyContWrapper"> <!-- /////////////////// bio ///////////////////////// --> </div> <div class="whoarewe"> <h2>Who are We?</h2> <p>Cedars Judo Club was started in 1963 as an evening class held in one of the rooms at the old 'Cedars' house on Shilton Road in Barwell. After several moves due to the club out growing it's venues it eventually ended up in the main sports hall at the Heath Lane Acadamy in Earl Shilton. It's now one of the largest clubs in the area with 200 square metres of mat area.</p> <p>We believe that most sports are great for kids and adults. However judo has got to be among the best of them all. Maybe we are biased but we think judo is rather special and unlike many sports it really is something that everyone can do, no matter what size, shape or age you are. Because of the vast range of techniques and ways of doing each technique, everyone can find something to suit them.</p> </div> <div class="postsElem"> <?php if ( have_posts() ) : ?> <?php while ( have_posts() ) : the_post(); ?> <div id="post-<?php the_ID(); ?>" <?php post_class(); ?>> <div class="post-header"> <div class="date"><?php the_time( 'M jy' ); ?></div> <h2><a href="<?php the_permalink(); ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2> <div class="author"><?php the_author(); ?></div> </div><!--end post header--> <div class="entry clear"> <?php if ( function_exists( 'add_theme_support' ) ) the_post_thumbnail(); ?> <?php the_content(); ?> <?php edit_post_link(); ?> <?php wp_link_pages(); ?> </div><!--end entry--> <div class="post-footer"> <div class="comments"><?php comments_popup_link( 'Leave a Comment', '1 Comment', '% Comments' ); ?></div> </div><!--end post footer--> </div><!--end post--> <?php endwhile; /* rewind or continue if all posts have been fetched */ ?> <div class="navigation index"> <div class="alignleft"><?php next_posts_link( 'Older Entries' ); ?></div> <div class="alignright"><?php previous_posts_link( 'Newer Entries' ); ?></div> </div><!--end navigation--> <?php else : ?> <?php endif; ?> </div> </div> </div> <?php get_footer(); ?> </body> </html <?php language_attributes(); ?>>
Мой файл footer.php:
<footer class="footercont" id="footer"> <div class="footerwrap"> <div class="footertitle"> <h2>Tell Us What You Want</h2> </div> <div class="footermain"> <p>If you like what you see, please get in contact with us straight away!</p> </div> <div class="emailus"> <div class="btn1"> <a href="#">Contact Us</a> </div> </div> <div class="copyright"> <p>Copyright©2016</p> </div> </div> </footer>
Мой файл style.css:
* { box-sizing: border-box; font-family: 'Antic', sans-serif; } body { margin: 0; padding: 0; } /* /////////////// Navigation ////////////// */ .navcontainer { position: fixed; width: 100%; background-color: #991357; } .nav ul li { list-style-type: none; display: inline-block; float: left; padding: 20px; } .nav ul li a { text-decoration: none; color: #FFFFFF; font-size: 30px; } #navcontainer { -webkit-animation-delay: 1s; -webkit-animation-duration: 1.5s; } @media (min-height: 579px) { .navcontainer { z-index: 10; } } /* /////////////// End Navigation ////////////// */ /* /////////////// Banner ////////////// */ .banner { padding-top: 5%; width: 100%; height: 60vh; background-color: #0066CC; text-align: center; color: #FFFFFF; padding-left: 10%; padding-right: 10%; } .bannerContent { height: inherit; padding-top: 15%; } h1 { font-size: 60px; font-weight: lighter; } h2 { font-size: 40px; font-weight: lighter; } .p2 { font-size: 30px; } .mainbody { padding-left: 20%; padding-right: 20%; text-align: center; } .whoarewe p { font-size: 20px; padding-bottom: 5%; } .postsElem { min-height: 70vh; border: solid 1px; margin-bottom: 5%; } /* /////////////// End Banner ////////////// */ /* //////////////////////////////////////////////////////main content /////////////////////////////////////// */ .theteam { padding: 0px; margin: 0px; height: inherit; text-align: center; overflow: hidden; min-width: 300px; /*background-color: #0776A0;*/ /*background-color: #217C7E;*/ background-color: #4086AA; } .teamWrap { margin-bottom: 20px; width: 100%; align-content: center; color: #FFFFFF; } .call-outs-container { max-width: 1400px; margin: 0px auto 0px auto; color: #FFFFFF; } .call-out { box-sizing: border-box; margin-bottom: 0px; padding-bottom: 20px; flex-basis: 30%; } .textcontelem { padding-left: 10%; padding-right: 10%; } @media (min-width: 1200px) { .RegElem { display: flex; justify-content: space-between; } .call-outs-container { display: flex; justify-content: space-between; } .textcontelem { padding-left: 0%; padding-right: 0%; } .call-out { /*background-color: #0776A0;*/ /*background-clip: #217C7E;*/ background-color: #4086AA; } } /* //////////////////////////////////////////end main content///////////////////////////////////////////// */ /* ////////////////////////////////////////////// footer /////////////////////////////////////////// */ .footercont { width: 100%; min-height: 400px; height: auto; background-color: #991357; text-align: center; align-content: center; font-family: 'Antic', sans-serif; color: #FFFFFF; } .footerwrap { padding-top: 30px; padding-bottom: 30px; width: 100%; min-height: 400px; height: auto; background-color: #991357; text-align: center; align-content: center; font-family: 'Antic', sans-serif; color: #FFFFFF; } .emailus { margin-top: 2%; margin-bottom: 2%; } .btn1 { text-align: center; width: 200px; height: 50px; margin: auto; text-align: center; background-color: #991357; border: solid 1px #FFFFFF; color: #FFFFFF; font-size: 30px; line-height: 50px; } .btn1 a { font-family: 'Antic', sans-serif; text-decoration: none; color: #FFFFFF; font-style: normal; } .btn1:hover a { color: #991357; } .btn1:hover { background-color: #FFFFFF; cursor: pointer; transition: all 1s ease 0s; } @media (min-width: 769px) { .btn1 { line-height: 100px; width: 300px; height: 100px; } .btn1 a { font-size: 30px; } } /* ////////////////////////////////////////// end footer /////////////////////////////////////////// */ /************************* Clearfix *************************/ .clearfix:before, .clearfix:after { content: " "; display: table; } .clearfix:after { clear: both; } .clearfix { *zoom: 1; }тем* { box-sizing: border-box; font-family: 'Antic', sans-serif; } body { margin: 0; padding: 0; } /* /////////////// Navigation ////////////// */ .navcontainer { position: fixed; width: 100%; background-color: #991357; } .nav ul li { list-style-type: none; display: inline-block; float: left; padding: 20px; } .nav ul li a { text-decoration: none; color: #FFFFFF; font-size: 30px; } #navcontainer { -webkit-animation-delay: 1s; -webkit-animation-duration: 1.5s; } @media (min-height: 579px) { .navcontainer { z-index: 10; } } /* /////////////// End Navigation ////////////// */ /* /////////////// Banner ////////////// */ .banner { padding-top: 5%; width: 100%; height: 60vh; background-color: #0066CC; text-align: center; color: #FFFFFF; padding-left: 10%; padding-right: 10%; } .bannerContent { height: inherit; padding-top: 15%; } h1 { font-size: 60px; font-weight: lighter; } h2 { font-size: 40px; font-weight: lighter; } .p2 { font-size: 30px; } .mainbody { padding-left: 20%; padding-right: 20%; text-align: center; } .whoarewe p { font-size: 20px; padding-bottom: 5%; } .postsElem { min-height: 70vh; border: solid 1px; margin-bottom: 5%; } /* /////////////// End Banner ////////////// */ /* //////////////////////////////////////////////////////main content /////////////////////////////////////// */ .theteam { padding: 0px; margin: 0px; height: inherit; text-align: center; overflow: hidden; min-width: 300px; /*background-color: #0776A0;*/ /*background-color: #217C7E;*/ background-color: #4086AA; } .teamWrap { margin-bottom: 20px; width: 100%; align-content: center; color: #FFFFFF; } .call-outs-container { max-width: 1400px; margin: 0px auto 0px auto; color: #FFFFFF; } .call-out { box-sizing: border-box; margin-bottom: 0px; padding-bottom: 20px; flex-basis: 30%; } .textcontelem { padding-left: 10%; padding-right: 10%; } @media (min-width: 1200px) { .RegElem { display: flex; justify-content: space-between; } .call-outs-container { display: flex; justify-content: space-between; } .textcontelem { padding-left: 0%; padding-right: 0%; } .call-out { /*background-color: #0776A0;*/ /*background-clip: #217C7E;*/ background-color: #4086AA; } } /* //////////////////////////////////////////end main content///////////////////////////////////////////// */ /* ////////////////////////////////////////////// footer /////////////////////////////////////////// */ .footercont { width: 100%; min-height: 400px; height: auto; background-color: #991357; text-align: center; align-content: center; font-family: 'Antic', sans-serif; color: #FFFFFF; } .footerwrap { padding-top: 30px; padding-bottom: 30px; width: 100%; min-height: 400px; height: auto; background-color: #991357; text-align: center; align-content: center; font-family: 'Antic', sans-serif; color: #FFFFFF; } .emailus { margin-top: 2%; margin-bottom: 2%; } .btn1 { text-align: center; width: 200px; height: 50px; margin: auto; text-align: center; background-color: #991357; border: solid 1px #FFFFFF; color: #FFFFFF; font-size: 30px; line-height: 50px; } .btn1 a { font-family: 'Antic', sans-serif; text-decoration: none; color: #FFFFFF; font-style: normal; } .btn1:hover a { color: #991357; } .btn1:hover { background-color: #FFFFFF; cursor: pointer; transition: all 1s ease 0s; } @media (min-width: 769px) { .btn1 { line-height: 100px; width: 300px; height: 100px; } .btn1 a { font-size: 30px; } } /* ////////////////////////////////////////// end footer /////////////////////////////////////////// */ /************************* Clearfix *************************/ .clearfix:before, .clearfix:after { content: " "; display: table; } .clearfix:after { clear: both; } .clearfix { *zoom: 1; }