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

小梁建站專注重慶中小企業網站建設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次 | 責任編輯:重慶網站建設公司

回到頂部
二十二世纪古墓奇兵爱慕影院 金鱼 秒速时时彩是哪个国家 壮志凌云网易博客 20选5开奖视频 东方珍兽在线客服 北极秘宝游戏玩法 快开彩票欢乐生肖 森巴宾果彩金 魔龙辅助 11选5计划20期 幸运生肖免费试玩 绞肉机角斗士赵信