CSS中如何使百度頁面居中呢?以下是一些簡單易懂的方法,歡迎參考。
/* 方法一:使用margin */ /* 首先將body的寬度設(shè)置為100% */ body { width: 100%; } /* 接著對百度頁面的寬度進行設(shè)置,然后通過margin值使其水平居中 */ #container { width: 1200px; margin: 0 auto; } /* 方法二:使用Flexbox */ /* 對外層容器進行Flex布局 */ #container{ display: flex; flex-direction: column; align-items:center; justify-content:center } /* 方法三:使用table-cell */ /* 首先對外層容器進行display:table; */ .wrapper { display: table; height: 100%; width: 100%; } /* 然后對內(nèi)層容器進行display:table-cell; 在水平和垂直方向上進行居中 */ .content { display: table-cell; text-align: center; vertical-align: middle; } /* 方法四:使用Absolute */ /* 首先對外層容器進行position:relative; */ .wrapper { position: relative; height: 100%; width: 100%; } /* 然后對內(nèi)層容器進行position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); */ .content { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
以上就是一些使百度頁面居中的簡單方法,希望可以幫助到你。