色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

text-align:center與display:inline組合塊居中,多個行內元素/塊狀元素居中方法

老白8年前2127瀏覽0評論

 行內元素塊狀元素居中方法.png

:改變塊級元素的 display 為 inline 類型(設置為 行內元素 顯示),然后使用 text-align:center 來實現(xiàn)居中效果。如下例子:

html代碼:

<body> <div>     <ul>         <li><a href="#">1</a></li>         <li><a href="#">2</a></li>         <li><a href="#">3</a></li>     </ul> </div> </body>

css代碼:

<style> 
.container{
    text-align:center; } /* margin:0;padding:0(消除文本與div邊框之間的間隙)*/ 
.container ul{
    list-style:none;
    margin:0;
    padding:0;
    display:inline; } /* margin-right:8px(設置li文本之間的間隔)*/ 
.container li{
    margin-right:8px;
    display:inline; } </style>

這種方法相比第一種方法的優(yōu)勢是不用增加無語義標簽,但也存在著一些問題:它將塊狀元素的 display 類型改為 inline,變成了行內元素,所以少了一些功能,比如設定長度值。