0 
<html>
<head>
<style type="text/css">
         #wholeborder{
        background-color : #f2f2f2;
        border-radius:5px;
        border:1px solid #222;
        resize:both;
        width:700px;
        height:320px;
        overflow:auto;

        }

        #navigatorForLinkedIN{
         height:70px;
        }
        ul#breadcrumbs{
            list-style:none;
            /* optional */
            margin:100px;
            padding:10px 2px 10px 10px;
            background:#f2f2f2;
            width:500px;
            height:30px;
            border-radius:5px;
            border:1px solid #222;
            -moz-box-shadow:0 0 3px 0 #000;

        }
        ul#breadcrumbs li{
            float:left;
            background:;
            height:30px;
            padding:0 23px 0 10px;
            text-align:center;
            text-decoration:none;
            text-color:#7a7a7a;
            line-height:32px;
        }
        ul#breadcrumbs li.active{
            background:url(../images/greenNav.png)no-repeat right;
            color:#fff;
        }
        ul#breadcrumbs li a{
            display:block;
            text-decoration:none;
            color:#2d2d2d;
            line-height:32px;
            text-shadow:0 0 1px #222;
        }
        ul#breadcrumbs li a:hover{
            color:#000000;
            background: url(../images/greenNav.png);
        }

    </style>

</head>
<body>
<div class="wholeborder" id="wholeborder">
            <div class="navigatorForLinkedIN" id="navigatorForLinkedIN">
                <ul id="breadcrumbs">
                    <li class="active"><a href="">Connect with LinkedIn</a></li>
                    <li><a href="">Invite Friends</a></li>
                    <li><a href="">Complete Profile</a></li><a href="">
                </a></ul><a href="">
             </a></div><a href="">
                </a><div class="linkedInLoginBox"><a href="">
                    <div class="head">
                        Discover contacts that can help you land your next job
                    </div>
                    </a><div class="body"><a href="">
                        </a><a class="sn-in" href="" title="Sign into LinkedIn" id="sn-lk-sign" rel="nofollow"><span class="sn-in-sign-span">Sign into LinkedIn</span></a>
                        <div class="disclaimer">
                        All information and activity will be kept private. <a href="" target="_blank">Learn More</a>
                        </div>
                    </div>
                </div>
            </div>

</body>
</html>

これは私のhtmlページです

4

5 に答える 5

2

マージンは100pxです。それがそれを押し下げるものです

        ul#breadcrumbs{
        list-style:none;
        /* optional */
        margin:100px;
        padding:10px 2px 10px 10px;
        background:#f2f2f2;
        width:500px;
        height:30px;
        border-radius:5px;
        border:1px solid #222;
        -moz-box-shadow:0 0 3px 0 #000;

    }

これでマージンを変更します。100 はそれを押し下げます。このようなものを使用できます。

margin-top:;
margin-left:;
margin-right:;
margin-bottom:;
于 2013-09-25T09:17:42.557 に答える
1

Js フィドルを確認する

http://jsfiddle.net/Ydbre/

margin:100pxで削除ul#breadcrumbs

于 2013-09-25T09:22:39.393 に答える
1

リンクから確認できるフィドルを更新しました。

更新されたコード:

/* optional */
margin:10px 100px;

元のものはmargin:100px、すべての面から 100px を意味していました。ただし10px 100px、上/下:10px | 左/右:100px;

更新されたフィドル: http://jsfiddle.net/sLV5h/2/

于 2013-09-25T09:20:32.730 に答える
1

ul#breadcrumbs にスタイルがあります:margin:100px;に変更できますmargin:0 100px 100px。それでも、body および html コンテナーのマージンとパディングを設定することもできます。

html, body{
  margin:0;
  padding:0;
}
于 2013-09-25T09:19:00.177 に答える
1

フィドルで言うようにhttp://jsfiddle.net/sLV5h/1/：

答えは変えることだった

ul#breadcrumbs{
    list-style:none;
    /* optional */
    margin:100px;                 <-------This Line
    padding:10px 2px 10px 10px;
    background:#f2f2f2;
    width:500px;
    height:30px;
    border-radius:5px;
    border:1px solid #222;
    -moz-box-shadow:0 0 3px 0 #000;

}


    ul#breadcrumbs{
        list-style:none;
        /* optional */
        margin:0px 100px 100px 100px;     <----- by this (or something else)
        padding:10px 2px 10px 10px;
        background:#f2f2f2;
        width:500px;
        height:30px;
        border-radius:5px;
        border:1px solid #222;
        -moz-box-shadow:0 0 3px 0 #000;

    }

(ダークナイトへの挨拶)

于 2013-09-25T09:22:54.870 に答える