0

更新:

我发现了这个:margin: 0 auto; 在样式表的 body {} 块中使标题移动。如果我删除它,横幅标题图片会向右移动。所以那条线是罪魁祸首。有人知道为什么吗?

随着我的进步(有点神秘),问题转向了另一个方向。

我有这个头文件:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">

    <head profile="http://gmpg.org/xfn/11">
        <link rel="stylesheet" href= "<?php echo base_url() ?>css/main_style.css" />        
        <link rel="stylesheet" href= "<?php echo base_url() ?>css/webform.css" />

    </head>
    <div id="header" class = "header"><h1 class="header">Real Estate Worldwide</h1> </div>

<body>

连接到这个视图文件(我在 MVC 上)

视图中的代码与问题无关,我问过,所以我们将跳过它。

然后我有这个样式表。

<style type = "text/css">
::selection{ background-color: #E13300; color: white; }
::-moz-selection {background-color: #E13300; color: white; }
::webkit-selection{ background-color: #E13300; color: white; }





body {



        background:url('../assets/uploads/miweb/gradient2.png');
        background-repeat:repeat-x;

        margin: 40px;
        font: 13px/20px normal Helvetica, Arial, sans-serif;
        color: #4F5155;
        width:600px;
        height:500px;
        margin: 0 auto;

    }
#header {

    float:center;
    background: url("../jq185/css/start/images/ui-bg_gloss-wave_75_2191c0_500x100.png") repeat-x scroll 50% 50% #2191C0;
    font-family: 'trebuchet ms',geneva,arial,tahoma,sans-serif;
    font-size: 10px;
    margin: 0 auto;
    margin-top: 2px;
    padding: 0;
    width: 1050px;
    h2 {color:#ffffff;}


}
    .header {

    color:#ffffff;
    }

问题:

如果我从样式表中删除 3 个选择 ::selection 行,背景主体中的渐变效果就会消失。

如果我把它留在那里,那么渐变效果会起作用,但是您在样式表下方看到的#header jpg 文件会从居中的 marging: 0 auto; 改变它的位置。向右。

你在那里有完整的代码。我很困惑,因为我不明白为什么 ::selection 之类的东西会对引用 body {} 的代码片段产生根本影响,其中调用渐变图片并且还会影响该 body {} 中的字体样式

二更新

这是控制器

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class Home_c extends CI_Controller {



    function __construct()
    {

        parent::__construct();
        $this->load->model('home_model');


    }


    public function index ()

    {

        $this->load->view('header');
        $this->load->view('home');

    }




    public function load()


    {   $this->load->view('header');
        $data['paises'] = $this->home_model->devolverPaises();
        $data['ofertas'] = $this->home_model->devolverOfertas();
4

1 回答 1

0

如果您看到的奇怪效果与没有适当的标记有关,我不会感到惊讶。

编辑:当我发表评论时,我意识到对于 OP 来说可能还不够清楚。

您的 HTML 结构必须有效,首先是:

<!DOCTYPE html >

<html>
    <head>
        <!-- title, meta, styles, etc go here -->
    </head>

    <body>
        <!-- all your other content goes here -->
    </body>
</html>

确保当您的页面在浏览器中呈现时,当您查看查看源代码时,您会在适当的位置看到这些容器元素,并像这样嵌套。更好的是,通过验证服务运行您的页面。(例如 http://validator.w3.org/)

您的 CSS 无效:

#header {
    float:center; /* no such attribute... only left, right, none, or inherit */
    h2 {color:#ffffff;} /* you can't nest tags inside other specs, except with the use of pre-processors like SASS or LESS */
}
于 2012-11-14T14:44:08.453 回答