2011-09-17 28 views
0

我的界面有一個簡單的問題。我將描述如下的情況:接口問題沒有調用正確的css風格。如何調用正確的?

我有一個main_menu.php(頂部菜單)那我打電話,我的所有網頁的頂部菜單有自己的CSS樣式,波紋管頂部的菜單我打電話一個很小的應用程序,我稱之爲信息面板它顯示了我的服務器的一些信息,一些產品的價格等

這裏的關鍵是,我的頂部菜單是可以正常使用,我的信息面板(top_panel。 php)也在工作,但是當我在同一頁面調用2應用程序時(例如在我的index.php中調用)時,css風格崩潰了。我嘗試了一切,但沒有任何改變。

如何將信息面板置於背景中,這有可能嗎?或者最好在單個文件中一起編寫CSS樣式?

這裏[從這裏EDITED]去一些代碼:

我共同的頁面 - > top.php

<?php 
// My common configurations 
include_once("config/config.php"); 

?> 

<link rel="stylesheet" type="text/css" href="<?=$server_name;?>/portal/style.css" /> 

<table> 
<tr> 
    <td> 

    <?php 
    // if session ten require the main menu 
otherwise shows blank 
    if (isset($_SESSION["nome"])) { 

     require("main_menu.php"); 

    } 
    ?> 

    </td> 
</tr> 
<tr> 

    <td> 

    <?php include("includes/top_panel.php"); // the panel shows up but it is in the foreground and I need it fixed in the background ?> 

    </td> 

</tr> 


<!-- some other code --> 

</table> 

?> 

我的CSS樣式在另一個文件是一個長文件,因爲一切都在那裏。

的main_menu.php(菜單風格是所有連同菜單本身,只顯示樣式)

<style type="text/css"> 
body { 
    font: 10px normal Verdana, Arial, Helvetica, sans-serif; 
    margin: 0; 
    padding: 0; 
} 
h1 { 
    font: 4.7em normal Georgia, 'Times New Roman', Times, serif; 
    color: #333; 
    margin: 0; 
    padding: 0px 0; 
} 
h1 small { 
    font: 0.2em normal Verdana, Arial, Helvetica, sans-serif; 
    text-transform:uppercase; 
    letter-spacing: 1.5em; 
    display: block; 
    color: #fff; 
} 
.container {width: 975px;} 

ul#topnav { 
    margin: 0; padding: 0; 
    float: left; 
    width: 975px; 
    list-style: none; 
    position: relative; 
    font-size: 1.2em; 
    background: url(<?=$server_name;?>/portal/images/topnav_stretch.gif) repeat-x; 
} 

/* posicao do menu */ 
ul#topnav li { 
    //background: #000; 
    background: url(<?=$server_name;?>/portal/images/topnav_stretch.gif) repeat-x; 
    float: left; 
    margin: 3px; padding: 0; 
    border-right: 1px solid #555; 
} 
ul#topnav li a { 
    padding: 10px 15px; 
    display: block; 
    color: #f0f0f0; 
    text-decoration: none; 
} 
ul#topnav li:hover { background: #1376c9 url(<?=$server_name;?>/portal/images/topnav_active.gif) repeat-x; } 
ul#topnav li span { 
    float: left; 
    padding: 15px 0; 
    position: absolute; 
    left: 0; top:35px; 
    display: none; 
    width: 975px; 
    background: #1376c9; 
    color: #fff; 

    -moz-border-radius-bottomright: 5px; 
    -khtml-border-radius-bottomright: 5px; 
    -webkit-border-bottom-right-radius: 5px; 
    -moz-border-radius-bottomleft: 5px; 
    -khtml-border-radius-bottomleft: 5px; 
    -webkit-border-bottom-left-radius: 5px; 
} 
ul#topnav li:hover span { display: block; } 
ul#topnav li span a { display: inline; } 
ul#topnav li span a:hover {text-decoration: underline;} 
</style> 

我top_panel.php

<style type="text/css"> 

#content_marquee { 



    position: relative; 

    top: 40px; 

    width: 975px; 

    height: 30px; 

    color: yellow; 

    font-family: Verdana, Georgia, sans-serif; 

    font-size: 25px; 



    background: url(images/bg_black.png); 

    background-repeat: repeat x y; 



    -moz-border-radius-bottomright: 5px; 

    -khtml-border-radius-bottomright: 5px; 

    -webkit-border-bottom-right-radius: 5px; 

    -moz-border-radius-bottomleft: 5px; 

    -khtml-border-radius-bottomleft: 5px; 

    -webkit-border-bottom-left-radius: 5px; 



    -moz-border-radius-topright: 5px; 

    -khtml-border-radius-topright: 5px; 

    -webkit-border-top-right-radius: 5px; 

    -moz-border-radius-topleft: 5px; 

    -khtml-border-radius-topleft: 5px; 

    -webkit-border-top-left-radius: 5px;  



} 



#opacity_div{ 

    opacity:0.5; 

} 

</style> 



<div id="opacity_div"> 

    <label><marquee id="content_marquee"> __file__ __line__ __sleep __wakeup </marquee></label> 

</div> 
+2

我不知道什麼是錯的,因爲我看不到任何要調試的東西。你能發佈至少*一些*代碼嗎?也許是你的代碼的簡化版本? – Blender

+0

@Blender我編輯了我的問題。我希望現在更清楚。謝謝。 – B4NZ41

+0

如果您已經通過選擇答案旁邊的空白記號來解決問題「接受」最有幫助的答案。如果您自己發現解決方案將其作爲答案發布,然後接受該答案。不要在標題中編輯「解決」。 – ChrisF

回答

0

在深入瞭解我的樣式表和界面之後,終於發現了一些小錯誤,並且我修復了所有這些錯誤。我回答自己的問題只是爲了告訴它現在正在工作。

然後我做了如下:

Styles.css中 它有我的所有樣式現在,我已經在這裏集中。

我top.php

它的top_panel.php一個電話,但有一點不同,我是用表格標記之前,現在我使用div標籤,它使大與表不一致,main_menu.php在後臺,top_panel.php在前臺。

然後我呼籲top_panel.phpmain_menu.php之前,現在是在後臺,我可以調用菜單,它是在前臺。

這是一個解決方法,它的工作原理和我所期望的完全一致。然後問題解決了。

現在我有4頁涉及到arquieve結果。

  • main_menu.php - >這是頂級菜單
  • style.css文件 - >我所有的styls是在這裏(在界面不再)
  • top.php - >這是佈局/接口該系統的(這就是所謂的無處不在)
  • top_panel.php - >(現在它只是要求從數據庫中的一些DATAS並顯示它)

這個祕密之前調用top_panel.php於一切。並將佈局更改爲無佈局佈局。最後我不擔心我的佈局中的位置不對。

-1

的風格標籤只能在頭部使用。我可能會錯過一些東西,但是你不應該在正文部分有這樣的樣式聲明。我會將所有的CSS合併成一個(或幾個)樣式表,然後@import將它們導入到一個主要的CSS中,以便在您的index.php文件中包含頭部分。

+0

我已經發布了我自己的問題的答案,因爲我解決了這個問題,無論如何非常感謝你的回報。我真的很喜歡。我有愉快的一天。 – B4NZ41