日本不卡不码高清免费观看,久久国产精品久久w女人spa,黄色aa久久,三上悠亚国产精品一区二区三区

您的位置:首頁技術文章
文章詳情頁

css3 - css垂直水平居中?

瀏覽:253日期:2023-08-05 18:11:31

問題描述

如何實現B在A中,垂直和水平方向都居中?代碼如下:

<!DOCTYPE html><html lang='zh'><head> <meta http-equiv='X-UA-Compatible' content='IE=Edge'> <meta charset='UTF-8'/> <title></title> <style>#A { position: relative; width: 500px; height: 500px; background-color: green;}#B { position: absolute; max-width: 300px; max-height: 300px; background-color: blue;} </style></head><body><p id='A'> <p id='B'>哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥給哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥給哥哥哥哥哥哥哥給哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥給哥哥哥哥哥哥哥給哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥給哥哥哥哥哥哥哥給哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥哥給哥哥哥 </p></p></body></html>

問題解答

回答1:

兩種方法:

第一種:

#A { position: relative; width: 500px; height: 500px; background-color: green;}#B { position: absolute; max-width: 300px; max-height: 300px; background-color: blue; /* add */ margin:auto; left:0; right:0; top:0; bottom:0;}

第二種:

#A { position: relative; width: 500px; height: 500px; background-color: green;}#B { position: absolute; max-width: 300px; max-height: 300px; background-color: blue; /* add */ top:50%; left:50%; transform:translate(-50%,-50%);}回答2:

#A {display:table-cell;vertical-align:middle; } #B {/* position:absolute; */margin:0 auto; }

http://jsfiddle.net/7uakz7p1/

回答3:

今天剛學到的一種比較簡單的方法:父容器設置display: flex; 要居中的子元素設置margin: auto;即可。本例中

#A {position: relative;width: 500px;height: 500px;background-color: green;/*add*/display: flex;display: -webkit-flex; }#B {/*position: absolute;*/max-width: 300px;max-height: 300px;background-color: blue;/*add*/margin: auto; }

ps. IE下好像有問題...

回答4:

#A { position: relative; width: 500px; height: 500px; background-color: green;}#B { width: 50%; height: 50%; margin: auto; position: absolute; top: 0; left: 0; bottom: 0; right: 0; max-width: 300px; max-height: 300px; background-color: blue;} 回答5:

正好發現一個網站,給了好多解決方案 Centering in CSS: A Complete Guide

回答6:

http://jsfiddle.net/nbayw7ea/

回答7:

http://css-tricks.com/centering-css-complete-guide/

標簽: CSS
相關文章:
日本不卡不码高清免费观看,久久国产精品久久w女人spa,黄色aa久久,三上悠亚国产精品一区二区三区
精品视频一区二区三区在线观看 | 精品国产网站| 日韩精品乱码av一区二区| 亚洲综合二区| 久久午夜精品一区二区| 久热综合在线亚洲精品| 亚洲欧美日韩国产| 蜜桃一区二区三区在线观看| 中文视频一区| 四虎国产精品免费久久| 久久亚洲电影| 伊人久久亚洲| 日本国产欧美| 国产欧美日韩亚洲一区二区三区| 欧美日一区二区在线观看| 国产欧美一区二区三区国产幕精品 | 国产成人调教视频在线观看| 国产一区二区色噜噜| 成人一区而且| 国产精品原创| 亚洲国内欧美| 日韩精品一二三| 亚洲男人在线| 国产精品视频一区二区三区| 精品中文字幕一区二区三区 | 亚洲无线一线二线三线区别av| 欧美综合另类| 视频一区在线播放| 日本在线不卡视频一二三区| 国产图片一区| 亚洲精品永久免费视频| 国产91精品对白在线播放| 丝袜美腿亚洲色图| 日韩不卡一区二区| 精品久久视频| 国产99久久久国产精品成人免费| 免费观看久久久4p| 国产精品综合| 成人精品中文字幕| 中文一区一区三区免费在线观 | 不卡福利视频| 99综合视频| 国产精品亚洲产品| 成午夜精品一区二区三区软件| 午夜久久免费观看| 欧美日韩亚洲一区在线观看| 成人国产精选| 亚洲欧美日韩国产综合精品二区| 欧美日韩亚洲国产精品| 欧美天堂视频| 日韩一区二区免费看| 国产精品网站在线看| 国产精品av一区二区| 国产午夜精品一区在线观看| 日韩国产专区| 亚洲欧洲国产精品一区| 国产一区二区久久久久| 欧美一级专区| 久久麻豆视频| 亚洲激情另类| 国产精品啊啊啊| 99视频精品视频高清免费| 中文字幕一区二区av| 精品视频网站| 亚洲黄页一区| 精品女同一区二区三区在线观看| 日韩网站在线| 久久精品国产久精国产爱| 蜜桃伊人久久| 中文字幕在线视频久| 亚洲字幕久久| 蜜臀国产一区| 青草国产精品久久久久久| av资源亚洲| 日韩精品视频中文字幕| 日本欧美不卡| 国产日韩亚洲| 在线亚洲激情| 伊人久久高清| 国产精品亚洲片在线播放| 久久国产精品毛片| 日本在线高清| 你懂的国产精品永久在线| 伊人久久一区| 亚洲手机在线| 中文字幕一区久| 国产精品jk白丝蜜臀av小说| 亚洲精品2区| 国产一区二区三区精品在线观看| 亚洲精品国产精品粉嫩| 久久婷婷亚洲| 久久精品欧洲| 国产麻豆精品久久| 亚洲三级在线| 伊人久久大香线蕉av超碰演员| 夜鲁夜鲁夜鲁视频在线播放| 精品欠久久久中文字幕加勒比| 欧美日韩伊人| 亚洲性视频在线| 欧美日韩国产综合网| 亚洲四虎影院| 四虎成人av| 精品久久免费| 国产精品一区二区免费福利视频| 日韩精品一二三区| 国产美女一区| 蜜臀av免费一区二区三区| 97国产精品| 美女国产精品久久久| 久久激情五月婷婷| 中文字幕中文字幕精品| 国产色综合网| 亚洲黄色在线| 亚洲欧美综合| 影视先锋久久| 国产综合激情| 欧美日韩一二三四| 波多视频一区| 高清一区二区三区av| 国产精品国产三级在线观看| 日韩一区二区三区四区五区| 亚洲欧美网站| 欧美午夜不卡| 国产一区二区高清| 模特精品在线| 水野朝阳av一区二区三区| 热久久久久久久| 美女网站久久| 亚洲欧洲美洲国产香蕉| 亚洲三级在线| 欧美视频久久| 国产精品玖玖玖在线资源| 国产精品白丝一区二区三区| 国产精品久久亚洲不卡| 国产高清精品二区| 久久精品三级| 日韩电影免费网址| 久久精品播放| 亚洲一区久久| 日韩成人一级| 麻豆成人91精品二区三区| 国产精品成久久久久| 日韩精品电影| japanese国产精品| 久久都是精品| 97精品资源在线观看| 欧美成人一二区| caoporn视频在线| 桃色一区二区| 亚洲国产一区二区三区在线播放| 天堂av在线一区| 日本免费一区二区视频| 麻豆国产精品视频| 香蕉成人av| 在线一区视频| 日韩精品免费观看视频| 国产极品久久久久久久久波多结野 | 国产视频一区二| 麻豆国产精品| 蜜桃成人av| 日韩国产精品久久久久久亚洲| 欧美在线黄色| 色乱码一区二区三区网站| 欧美va亚洲va日韩∨a综合色| 蜜臀av国产精品久久久久| 国产精品久久久免费| 人在线成免费视频| 亚洲欧美日韩在线观看a三区| 欧美日韩18| 成人久久一区| 日本不卡中文字幕| 国产精品国产一区| 国产午夜久久| 国产欧美亚洲一区| 中文字幕在线免费观看视频| 99riav国产精品| 亚洲不卡视频| 国产一区二区三区91| 夜夜精品视频| 国产精品99久久久久久董美香| 欧美日韩免费看片| 亚洲资源网站| 岛国av在线网站| 一区二区日韩免费看| 久久精品日韩欧美| 国产精品普通话对白| 国产极品模特精品一二| 黑丝一区二区| 久久精品国产999大香线蕉| 欧美日韩国产免费观看视频| 国产亚洲精品精品国产亚洲综合| 91亚洲国产| 91亚洲无吗| 欧美一区二区三区高清视频| 国产精品视频3p| 亚洲专区一区| 日韩成人综合| 国产日韩欧美一区在线| 午夜电影亚洲| 卡一卡二国产精品|