Question

！[在此处输入图像说明] [1]因此，我在Dreamweaver中创建了一个网站（类是关于Dreamweaver的），我在页面布局的最后一部分难以接受。

我目前有一个＆＃34;查看购物车＆＃34;我页面右上角的按钮，左边是全白空间，所以我决定在那里放一个768x15的广告。但是，如果我将广告放在与购物车相同的组中，它也会对齐，并且位于＆＃34;查看购物车＆＃34;的左侧。如果我将广告放在查看购物车上方，则会有一个换行符，从而留下更多的空白空间，与之相同。

我的简单问题：有没有办法获得广告和我的＆＃34;查看购物车＆＃34;同一行上的按钮，广告没有与页面右侧对齐？

这是一张图片，我知道我还有很多工作要做，但如果你注意到徽标和横幅占位符之上，这就是我的问题。谢谢！

http://tinypic.com/view.php?pic=16kz97o&s=6

<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
            <!--
                ez games
                author: kyle meek
                3/24/2013
            -->
        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        <title>ez games - home page</title>
        <link href="ez_styles.css" rel="stylesheet" type="text/css" />
        <link href="spryassets/sprymenubarhorizontal.css" rel="stylesheet" type="text/css" />
        <script src="spryassets/sprymenubar.js" type="text/javascript"></script>
    </head>

    <body id="bodyformat">
        <p id="logincart"><a href="viewcart.html">view cart</a></p>
        <script type="text/javascript">
            <!--
            google_ad_client = "ca-pub-0707070728226508";
            /* smalltop */
            google_ad_slot = "4701711529";
            google_ad_width = 728;
            google_ad_height = 15;
            //-->
        </script>
        <script type="text/javascript"
            src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
        </script>
        <p id="logobanner"><img name="ez_logo" src="" width="280" height="150" alt="ez games logo" style="background-color: #ffda00" />
        <img src="" width="1000" height="150" alt="ez games banner" style="background-color: #4212af" /></p>
        <br />
        <h3 id="textalign"><a href="index.html">home</a> &dagger; <a href="about_us.html">about us</a> &dagger; <a href="games.html">games</a> &dagger; <a href="contact_us.html">contact us</a> &dagger; <a href="locate_us.html">locate us</a></h3>

        <div id="ad1" align="center">
            <script type="text/javascript"><!--
                google_ad_client = "ca-pub-0707070728226508";
                /* banner ad */
                google_ad_slot = "9705490722";
                google_ad_width = 468;
                google_ad_height = 60;
                //-->
            </script>
            <script type="text/javascript"
            src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
            </script>
        </div>
        <br />
        <hr />
        <span id="vertnav">
            <h2>systems</h2><hr />
            <ul>
                <li><a href="atari.html">atari</a></li>
                <li><a href="sega_genesis.html">sega genesis</a></li>
                <li><a href="ps1.html">playstation</a></li>
                <li><a href="ps2.html">playstation 2</a></li>
                <li><a href="ps3.html">playstation 3</a></li>
                <li><a href="xbox.html">x-box</a></li>
                <li><a href="xbox360.html">x-box 360</a></li>
                <li><a href="nes.html">nes</a></li>
                <li><a href="snes.html">super nes</a></li>
                <li><a href="nintendo64.html">nintendo 64</a></li>
                <li><a href="gamecube.html">gamecube</a></li>
                <li><a href="wii.html">nintendo wii</a></li>
                <li><a href="wiiu.html">nintendo wii-u</a></li>
            </ul>
        </span>

        <section id="sect1">
            <aside id="sides"><h1>like us on facebook!</h1><br />
                <p><iframe src="http://www.facebook.com/plugins/like.php?href=http://www.facebook.com/ezgamesofficial"
                        scrolling="no" frameborder="0"
                        style="border:none; width:200px; height:80px"></iframe></p>
                <hr />
                <script type="text/javascript">
                    <!--
                    google_ad_client = "ca-pub-0707070728226508";
                    /* smallrect */
                    google_ad_slot = "5399715525";
                    google_ad_width = 180;
                    google_ad_height = 150;
                    //-->
                </script>
                <script type="text/javascript"
                    src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
                </script>
            </aside>
            <article id="art1"><h1>home</h1>
                <p>greetings! content of article one goes here! paragraphs are here. greetings! content of article one goes here! paragraphs are here. greetings! content of article one goes here! paragraphs are here. greetings! content of article one goes here! paragraphs are here. greetings! content of article one goes here! paragraphs are here. greetings! content of article one goes here! paragraphs are here.</p>
            </article>
            <article id="art2"><h1>article numero dos</h1>
                <p>lorem ipsum article 2 blah blah info. lorem ipsum article 2 blah blah info. lorem ipsum article 2 blah blah info. lorem ipsum article 2 blah blah info. lorem ipsum article 2 blah blah info. lorem ipsum article 2 blah blah info. </p>
            </article>
        </section>
        <footer id="foot"><hr />copyright&copy; ez games 2013 &dagger;&dagger;&dagger; all rights reserved.</footer>
    </body>
</html>

和我的css

#bodyformat #logincart {
    text-align: right;
}
#bodyformat #logincart a {
    color: #4212af;
    background-color: #ffda00;
    text-decoration: none;
    padding-left: 5px;
    padding-right: 5px;
}

Answer 1

尝试使用float而不是text-align。

#bodyformat #logincart {
    float: right;
}

更多信息： http://www.w3schools.com/cssref/pr_class_float.asp

关于换行符的HTML？

1 个答案: