Question to say "I can!"

浮動模塊的水平居中

2011-04-11

用萬戈的方法!

對于定寬的非浮動元素我們可以用 margin:0 auto; 進行水平居中,對于不定寬的浮動元素我們也有一個常用的技巧解決它的水平居中問題。分解如下:

1、HTML 部分:

<div class="box">
<p>我是浮動的</p>
<p>我也是居中的</p>
</div>

2、CSS 部分:

.box{
float:left;
position:relative;
left:50%;
}
p{
float:left;
position:relative;
right:50%;
}

這樣看來就很簡單了吧,父元素和子元素同時左浮動,然后父元素相對左移動50%,再然后子元素相對右移動50%,或者子元素相對左移動-50%也就可以了。如此簡單如此神奇。

作者:admin | Categories:設計問題 | Tags:

發表評論

電子郵件地址不會被公開。 必填項已用*標注

*

澳洲f1赛车b盘开奖套路 今日福建体彩22选5开奖结果 一本道全裸 河北3d开奖结果 东京热最新2019网址 东方6+1 上证指数多少点上证指数 广东南粤36选7历 贵州茅台股票分析论文 广东省福利*36选7 福州股票融资公司 5分彩骗局 西安沐足城 澳洲体彩幸运5开奖 麻将有多少种玩法 浙江十一选五开奖结 上原亚衣种子