二十二世纪古墓奇兵爱慕影院

小梁建站專注重慶中小企業網站建設SEO優化,讓您網站更具價值!

當前位置:首頁 > WEB前端學習 > [CSS3干貨]用好這3個屬性輕松實現不定寬高DIV居中!

[CSS3干貨]用好這3個屬性輕松實現不定寬高DIV居中!

時間:2018-08-18 23:53 來源:重慶網站制作公司(www.l2qz.net) 作者:重慶網站建設公司

 
 
 
[CSS3干貨]用好這3個屬性輕松實現不定寬高DIV居中!
 
 
  [CSS3干貨]用好這3個屬性輕松實現不定寬高DIV居中!

 
1.使用flex,在父元素設置
 
 
display: flex; 
 
justify-content: center;
 
align-items: center
 
 
 
2.使用css3的transform  
 
父元素設置:
 
display:relative
 
div 設置: 
 
transform: translate(-50%,-50%);
 
position: absolute;
 
top: 50%;
 
left: 50%;
 
3.使用display:table-cell   
 
父元素設置:
 
display:table-cell; 
 
text-align:center;
 
vertical-align:middle;
 
div 設置: 
 
display:inline-block;
 
vertical-align:middle;

版權聲明:本文:[CSS3干貨]用好這3個屬性輕松實現不定寬高DIV居中! 由重慶網站制作公司(www.l2qz.net)原創內容,如需要轉載請注明原文網址:重慶網站建設公司http://www.l2qz.net/

 
喜歡看,就分享到:

圍觀: 9999次 | 責任編輯:重慶網站建設公司

回到頂部
二十二世纪古墓奇兵爱慕影院 福彩必下一毒胆 新时时彩胆杀号 重庆时时规律破解器 11运夺金规则 福建11选5app 06081376腾讯分分彩开奖结果 gpk钱龙捕鱼试玩网站 排列五最易中奖方法 解太湖3d字谜解释 重庆时时才开奖号码 福彩3d开奖结果今天 彩票代打赚取佣金平台