" Include_once"使HTML显示不同

时间:2015-11-17 12:03:28

标签: php html

我决定将Include_once用于我的网站导航栏,因为我不断更改文本和链接并按文件进行操作非常繁琐。

但由于某种原因,当我使用include_once来包含导航栏时,它会使网站的某些元素以不同的方式显示,例如页面底部的表格将显示为拉伸,或者框格将是应该的大小的两倍。

我的include_once导航栏文件示例 -

<html>
<header>
<div class="headbot">
    <div class="container">
        <div class="navbar navbar_ clearfix extra">
          <div class="nav-collapse nav-collapse_ collapse">
      <ul class="nav sf-menu">
        <li class="active"><a href="index.html"><strong class="text">Home</strong><span>Home</span></a></li>
        <li><a href="http://google.com/"><strong class="text">News</strong><span>News</span></a>
          <ul>
            <li><a href="CaseStudy.html"><strong class="text">Case Studies</strong></a></li>
            <li><a href="http://google.com"><strong class="text">Latest News</strong></a></li>
            <li><a href="Events.html"><strong class="text">Upcoming Events</strong></a></li>
          </ul>
        </li>
        <li><a href="ContactUs.html"><strong class="text">Contact Us</strong><span>Contact Us</span></a></li>
      </ul>
    </div>
        </div>
    </div>
</div>

并将其包含在我的index.php

的顶部
<?php
include_once('includes/navbar.php');
?>
谁有任何想法?

2 个答案:

答案 0 :(得分:2)

我的建议是添加DOCTYPEheadbody代码(并关闭您的打开代码),如下所示:

<!DOCTYPE html>
<html>

<head>
    <title>My Title</title>
</head>

<body>

    <header>
        <div class="headbot">
            <div class="container">
                <div class="navbar navbar_ clearfix extra">
                    <div class="nav-collapse nav-collapse_ collapse">
                        <ul class="nav sf-menu">
                            <li class="active">
                                <a href="index.html">
                                    <strong class="text">Home</strong>
                                    <span>Home</span>
                                </a>
                            </li>
                            <li>
                                <a href="http://google.com/">
                                    <strong class="text">News</strong>
                                    <span>News</span>
                                </a>
                                <ul>
                                    <li>
                                        <a href="CaseStudy.html">
                                            <strong class="text">Case Studies</strong>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="http://google.com">
                                            <strong class="text">Latest News</strong>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="Events.html">
                                            <strong class="text">Upcoming Events</strong>
                                        </a>
                                    </li>
                                </ul>
                            </li>
                            <li>
                                <a href="ContactUs.html">
                                    <strong class="text">Contact Us</strong>
                                    <span>Contact Us</span>
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </header>

</body>

</html>

或者,如果您已将这些标记包含在文件中,只需使用 the meat 而不使用htmlheader标记:

<div class="headbot">
    <div class="container">
        <div class="navbar navbar_ clearfix extra">
            <div class="nav-collapse nav-collapse_ collapse">
                <ul class="nav sf-menu">
                    <li class="active">
                        <a href="index.html">
                            <strong class="text">Home</strong>
                            <span>Home</span>
                        </a>
                    </li>
                    <li>
                        <a href="http://google.com/">
                            <strong class="text">News</strong>
                            <span>News</span>
                        </a>
                        <ul>
                            <li>
                                <a href="CaseStudy.html">
                                    <strong class="text">Case Studies</strong>
                                </a>
                            </li>
                            <li>
                                <a href="http://google.com">
                                    <strong class="text">Latest News</strong>
                                </a>
                            </li>
                            <li>
                                <a href="Events.html">
                                    <strong class="text">Upcoming Events</strong>
                                </a>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <a href="ContactUs.html">
                            <strong class="text">Contact Us</strong>
                            <span>Contact Us</span>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>

答案 1 :(得分:0)

只需从文件中删除<html><header>标记即可。并保持代码清洁如下:

<div class="headbot">
    <div class="container">
        <div class="navbar navbar_ clearfix extra">
          <div class="nav-collapse nav-collapse_ collapse">
            <ul class="nav sf-menu">
               <li class="active"><a href="index.html"><strong class="text">Home</strong><span>Home</span></a></li>
               <li><a href="http://google.com/"><strong class="text">News</strong><span>News</span></a></li>
               <ul>
                   <li><a href="CaseStudy.html"><strong class="text">Case Studies</strong></a></li>
                   <li><a href="http://google.com"><strong class="text">Latest News</strong></a></li>
                   <li><a href="Events.html"><strong class="text">Upcoming Events</strong></a></li>
               </ul>
         <!--     </li>  --> <!-- here you have extra </li> tag  -->
               <li><a href="ContactUs.html"><strong class="text">Contact Us</strong><span>Contact Us</span></a></li>
            </ul>
          </div>
        </div>
    </div>
</div>

并将文件包含为:

<!DOCTYPE html>
<html lang="en">
  <head></head>
  <body>
   <?php  include_once('includes/navbar.php');   ?>

   </body>
 </html>