建站
咨詢
售后
建站咨詢
新聞中心
本篇內(nèi)容主要講解“html中把div居中的方法”，感興趣的朋友不妨來(lái)看看。本文介紹的方法操作簡(jiǎn)單快捷，實(shí)用性強(qiáng)。下面就讓小編來(lái)帶大家學(xué)習(xí)“html中把div居中的方法”吧!
創(chuàng)新互聯(lián)是一家專業(yè)提供洪澤企業(yè)網(wǎng)站建設(shè),專注與網(wǎng)站設(shè)計(jì)、網(wǎng)站建設(shè)、HTML5建站、小程序制作等業(yè)務(wù)。10年已為洪澤眾多企業(yè)、政府機(jī)構(gòu)等服務(wù)。創(chuàng)新互聯(lián)專業(yè)網(wǎng)站設(shè)計(jì)公司優(yōu)惠進(jìn)行中。
在html中把div居中的方法是，給div引入一個(gè)css樣式，然后添加自動(dòng)居中代碼【margin: 0 auto;】，利用外邊距的左右auto就可以實(shí)現(xiàn)div居中了。
本文操作環(huán)境：windows10系統(tǒng)、html 5、thinkpad t480電腦。
首先我們創(chuàng)建一個(gè)html文件，在body中插入一個(gè)div標(biāo)簽【
】,在head中引入css樣式【】給div引入一個(gè)css樣式【
】，并在style中添加樣式為div定義寬、高、背景色，代碼如下：【.a{width: 600px;height: 400px;background-color: #CB8B8C;}】，按【F12】打開瀏覽器預(yù)覽效果。
在瀏覽器中我們可以看到寫好的div，默認(rèn)他是對(duì)齊在網(wǎng)頁(yè)的左上角的，那我們?cè)趺茨茏宒iv自動(dòng)居中于網(wǎng)頁(yè)中呢？
可以在樣式a中添加自動(dòng)居中的代碼【margin: 0 auto;】。其實(shí)是利用外邊距的左右auto來(lái)實(shí)現(xiàn)居中效果。
添加【margin: 0 auto;】完成后，我們按CTRL+S保存文件并刷新瀏覽器頁(yè)面，可以看到div已經(jīng)自動(dòng)居中啦。
到此，相信大家對(duì)“html中把div居中的方法”有了更深的了解，不妨來(lái)實(shí)際操作一番吧！這里是創(chuàng)新互聯(lián)網(wǎng)站，更多相關(guān)內(nèi)容可以進(jìn)入相關(guān)頻道進(jìn)行查詢，關(guān)注我們，繼續(xù)學(xué)習(xí)！
本文題目：html中把div居中的方法
地址分享：http://www.dlmjj.cn/article/gispdh.html
