0

そのため、いくつかのブートストラップ tuts の後、wordpress と混ぜてみることにしました。そこにはたくさんの質問がありますが、私の主な関心事は、なぜ angies リストの画像が右に移動しないのかということです。css で float:right を実行し、pull-right クラスを実行し、margin-left:99% も実行しました... まだ残っています。なぜ?他のメモも同様に高く評価されます:)ここですべてを見ることができます http://soloveich.com/

<body>
<div class="container-fluid>

<div class="row-fluid" id="heady">
    <div class="span4"><div id="sign"></div></div>

     <div class="span4" id="menubg">
         <nav class="navbar">
       <div class="navbar-inner">
        <?php wp_nav_menu( array( 'theme_location' => 'main-menu' ) ); ?>
       </div> 
      </nav>       
     </div>

     <div class="span4" class="pull-right"><div id="angies"><img src="http://www.soloveich.com/wp-content/themes/Yellow-sign/images/angies.png"></div>
     <div id="lic">
        <ul id="licen">
          <li>Phone# (555)555-5555</li>
          <li>Lic# 7778899</li>
          <li>Bond# 111223344</li>
        </ul>
      </div>
     </div>
    </div>

そしてCSS

#heady {
background-color: #727272;
Height:370px;
}

#sign{
background-image: url(images/sign.png);
height: 334px;
width: 334px;
margin-left: 15px;
margin-top: 10px;
}

#menubg {
font-family:  'Contrail One', cursive;
font-weight: 200;
font-size: 25px;
text-decoration: none;
margin-top:130px;
}

#angies {
margin-top: 20px;
float: right;
margin-left: 99%;
}
4

1 に答える 1

0

#angiesページの一番右に配置したい場合は、次のようにします。

#angies{
  position:absolute;
  margin-top:20px;
  right:0px;
}

簡単に言うと、要素を右から 0px の絶対位置で強制的にフローから抜け出させます。

また、Chrome の開発者ツールを使用してページのソースを参照していたときに、ブートストラップ JavaScript が正しく埋め込まれていないことに気付きました。終了タグの前の最後のスクリプト タグを参照してください</body>。javascript ファイルを含めるときに、Wordpress で必須のテンプレートへのパスを含めるのを忘れました。そのコード行は次のようになります。

<script src="<?php bloginfo('template_url');?>/js/bootstrap.min.js"></script>

これだけの代わりに:

<script src="js/bootstrap.min.js"></script>
于 2013-09-24T02:56:27.450 に答える