<font id="nc9yk"></font>
  • <tt id="nc9yk"></tt>
          <rp id="nc9yk"><optgroup id="nc9yk"></optgroup></rp>
          <tt id="nc9yk"><form id="nc9yk"></form></tt>

            <cite id="nc9yk"></cite>

            css 利用 position + margin 實現固定盒子橫向縱向居中的方法

              發布時間:2020-12-23 14:32:25   作者:352328759   我要評論
            這篇文章主要介紹了css 利用 position + margin 實現固定盒子橫向縱向居中的方法,本文通過實例代碼給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下

            margin:auto; + position: absolute; 上下左右:0
            一看 demo 就懂的啦

            <!DOCTYPE html>
            <html>
            
            <head>
            	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
            	<meta charset="utf-8">
            	<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
            	<title>利用 position + margin 實現固定盒子橫向縱向居中</title>
            	<style>
            		body * {
            			outline: 1px #ff0000 solid;
            		}
            
            		.father {
            			width: 500px;
            			height: 300px;
            			position: relative;
            		}
            
            		.father .son {
            			width: 180px;
            			height: 140px;
            			/*  */
            			position: absolute;
            			right: 0;
            			bottom: 0;
            			top: 0;
            			left: 0;
            			margin: auto;
            		}
            	</style>
            </head>
            
            <body>
            	<div class="father">
            		<div class="son">margin:auto + 上下左右:0</div>
            	</div>
            </body>
            
            </html>

            //end

            到此這篇關于css 利用 position + margin 實現固定盒子橫向縱向居中的方法的文章就介紹到這了,更多相關css固定盒子橫向縱向居中內容請搜索腳本之家以前的文章或繼續瀏覽下面的相關文章,希望大家以后多多支持腳本之家!

            相關文章

            • CSS 同級元素position:fixed和margin-top共同使用的問題

              這篇文章主要介紹了CSS 同級元素position:fixed和margin-top共同使用的問題的相關資料,小編覺得挺不錯的,現在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
              2018-09-13
            • 使用CSS實現盒子水平垂直居中的方法(8種)

              這篇文章主要介紹了使用CSS實現盒子水平垂直居中的方法(8種),文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來
              2020-11-11
            • CSS盒子居中的常用的幾種方法(小結)

              這篇文章主要介紹了CSS盒子居中的常用的幾種方法,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學
              2020-03-31

            最新評論

            hao500彩票 www.acoreder.com:保定市| www.gangtieye.com:会昌县| www.brqxbjgs.com:隆昌县| www.smithbmw.com:抚松县| www.king1000.com:巫山县| www.kingsfishing.com:莱芜市| www.damoa33.com:铜川市| www.web3key.com:陇南市| www.fqchat.com:常熟市| www.oranjebastion.org:长泰县| www.theabsenceofsounds.com:双城市| www.merryzoe.com:永和县| www.cp3396.com:阿鲁科尔沁旗| www.submitbookmarkingsites.com:东方市| www.mlshgs.com:丹寨县| www.cp5776.com:松阳县| www.shahidhashmi.net:平顺县| www.giggiblu.com:四川省| www.cp3929.com:望谟县| www.nishiyama-shotengai.net:白玉县| www.8dem.com:鄱阳县| www.maritimelawyer-china.com:股票| www.alldownloadstuff.com:昌乐县| www.ykyumiao.com:威远县| www.bromoijenvacation.com:游戏| www.cnkaidajixie.com:铁岭县| www.culasse-moteur.com:泰州市| www.chunmiranliao.com:吴川市| www.becaramoscow.com:瓮安县| www.zikao363.com:南木林县| www.aggressive-lawyers.com:常宁市| www.486268.com:柘荣县| www.philjohannes.com:当涂县| www.stranded-deep.net:枣庄市| www.idai777.com:永善县| www.booksgratis.com:平武县| www.huangshouqi.com:上杭县| www.busongqi.com:太谷县| www.paperswall.net:会东县| www.z9862.com:临泉县| www.qyxc188.com:乌什县| www.aaronbown.com:许昌市| www.procarpetcleaningservices.com:新化县| www.598729.com:武清区| www.elihunter.com:永德县| www.horseflyblog.com:桦川县| www.jk4399.com:昌吉市| www.126youxiang.com:吕梁市| www.apexautoleasing.com:台前县| www.salmonbc.com:上虞市| www.shmhhb.com:库伦旗| www.gay5999.com:泗阳县| www.yyyuanyi.com:克东县| www.geeks-corner.com:微山县| www.aaronbown.com:中阳县| www.abbottslandscape.com:临城县| www.vivaviralvideo.com:南昌县| www.g9892.com:精河县| www.tadalafil1.com:蒙阴县| www.sihaicsw.com:鄂温| www.uberdrivingparttime.com:中江县| www.weblogic-training.com:盐城市| www.q5653.com:清镇市| www.ledlightdiecasting.com:梅河口市| www.360cityvisit.com:洛川县| www.midwestdivers.com:利辛县| www.taoyuangarden.com:和林格尔县| www.mop-mrp.com:陕西省| www.maltavizesi.net:博野县| www.livewellfeelgood.com:巨野县| www.healthwearonline.com:五指山市| www.rs338.com:张家口市| www.crpdh.cn:汪清县| www.sznks.com:杭州市| www.sydney-quilt.com:河北区| www.imaxsurfacecoating.com:肇源县| www.blainebandboosters.org:娱乐| www.ouruolai.com:博爱县| www.i-vv8.com:漳平市| www.wwwhg9693.com:赫章县| www.glviagragtr.com:鞍山市| www.lgtopc.com:西丰县| www.j0662.com:法库县| www.clarebirth.com:耒阳市|