0

更新しました:

私はこれを発見しました:マージン: 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>

このViewファイルに接続するもの(私は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 ファイルは、中央のマージンから位置を変更します: 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 に答える