Question

我正在尝试用php开发一个网站。在我的主页面上，我使用include函数（在php中）包含其他文件。但是当加载主页面时，其他文件中的CSS全部搞砸了。它显示好像根本没有CSS，所以一切都在彼此之上。当我单独加载文件时，一切都很好。

所以在index.php文件中我有

//code 
include 'toolbar.php';

然后在toolbar.php中我有

div.fileinputs 
{
    position: relative;
}

div.fakefile 
{
    position: absolute;
    top:0px;
    left:0px;
    z-index: 10;
}
.text_computer
{
    position: absolute;
    top:80px;
    left:20px;
    z-index: 20;
    text-align:center
}
input.file 
{
    cursor: pointer;
    position: relative;
    text-align: right;
    -moz-opacity:0 ;
    filter:alpha(opacity: 0);
    opacity: 0;
    z-index: 30;
    width:317;
    height:202;
}
.text_upload
{
    position: absolute;
    top:6px;
    left:80px;
    z-index: 20;
    text-align:center
}
input.submit
{
    cursor: pointer;
    position: relative;
    text-align: right;
    -moz-opacity:0 ;
    filter:alpha(opacity: 0);
    opacity: 0;
    z-index: 30;
    width:330;
    height:50;
}
//code
<div class="fileinputs">
            <input type="file" class="file" name='image'/>
            <div class="fakefile">
                <img src='red_frame.png' width='330'>
            </div>
            <div class="text_computer">
                <a style='font-family:Arial;color:white;'><font size='6'>Choose a photo from<br> your Computer</font></a>
            </div>
        </div>
        <div class="des_box">
            <textarea name='description' cols='38' rows='4' placeholder='Enter a description here...' maxlength='500'></textarea><br>
        </div>
        <br>
        <div class="fileinputs">
            <input type="submit" class="submit" value='Upload'>
            <div class="fakefile">
                <img src='red_frame.png' width='330' height='50'>
            </div>
            <div class="text_upload">
                <a style='font-family:Arial;color:white;'><font size='6'>UPLOAD!!!!</font></a>
            </div>
        </div>

这不是所有的代码，但当我将它包含在index.php中时，这是相互堆叠的部分

当我刚运行toolbar.php时，一切都很好。

有没有办法解决这个问题？

是否会出现导致此问题的其他问题？

等等没关系，我在index.php的顶部发现了这个<!DOCTYPE html>，并将其删除，看看是否能解决问题，并且出于某种原因，它确实存在。我不知道为什么修复它，但现在一切正常。

Answer 1

我建议不要使用'include'，请尝试以下方式 -

<?php 
.
.
.
?>
<link href="../bootstrap/css/bootstrap-timepicker.min.css" rel="stylesheet" 
type="text/css"/>
<?php 
.
.
.
?>

Answer 2

只需通过PHP包含CSS文件即可。它是合法的！

<?php include ('yourheader.php'); ?>
<style>
<?php include ('main.css'); ?>
</style>

Answer 3

您也可以使用@import加载css样式。

    @import url('/css/styles.css');
    @import url('/css/main.css');
    @import url('/css/color.css');

/ *上面的所有三个CSS文件都将从中加载这个单一的文件。 * /

CSS中的问题和包含PHP的功能

3 个答案: