相邻元素间距以margin:的值较大的为准 

<HTML>
<HEAD>
    <TITLE>Examples of margins, padding, and borders</TITLE>
    <STYLE type="text/css">
        LI.aaa {
            color: white; /* text color is white */
            background: blue; /* Content, padding will be blue */
            margin: 12px 12px 12px 12px;
            padding: 12px 12px 0px 12px; /* Note 0px padding down */
            list-style: none /* no glyphs before a list item */
                            /* No borders set */
        }
        LI.bbb {
            color: white; /* text color is white */
            background: blue; /* Content, padding will be blue*/
            margin: 20px 20px 20px 20px; /*Finally, the ditance between .aaa and .bbb will be 20px !!!*/
            padding: 12px 12px 0px 12px; /* Note 0px padding down */
            list-style: none /* no glyphs before a list item */
                            /* No borders set */
        }

    </STYLE>
</HEAD>
<BODY>
<UL>
    <LI class="aaa">First element of list</LI>
    <LI class="bbb">Second element of list is
        a bit longer to illustrate wrapping.</LI>
</UL>
</BODY>
</HTML>

 

posted @ 2017-10-19 08:57  sky20080101  阅读(105)  评论(0)    收藏  举报