如何實(shí)現(xiàn)按鈕水平居中 在網(wǎng)頁(yè)設(shè)計(jì)中怎么讓背景圖片水平居中?
在網(wǎng)頁(yè)設(shè)計(jì)中怎么讓背景圖片水平居中?有三種方法可以使用CSS將網(wǎng)頁(yè)的背景圖像居中。1第一種是像素設(shè)置。他們中的許多人使用這個(gè),但它也是最麻煩的一個(gè):<div style=“寬:800px高:600
在網(wǎng)頁(yè)設(shè)計(jì)中怎么讓背景圖片水平居中?
有三種方法可以使用CSS將網(wǎng)頁(yè)的背景圖像居中。1第一種是像素設(shè)置。他們中的許多人使用這個(gè),但它也是最麻煩的一個(gè):<div style=“寬:800px高:600像素背景:url(圖片地址)不重復(fù)250px 270像素邊框:1px實(shí)心#中國(guó)交建“></div> 2。第二種:50%設(shè)置,非常方便。<div樣式=“寬:800px高:600像素背景:url(圖片地址)不重復(fù)50%50%邊框:1px實(shí)心#中國(guó)交建“></div> 3。類型3:設(shè)置為中心(注:第二個(gè)中心可以省略,因?yàn)槟J(rèn)為中心)。<div樣式=“寬:800px高:600像素背景:url(圖片地址)無(wú)重復(fù)中心Centerborder:1px實(shí)心#中國(guó)交建“></div>
1。首先,我們需要?jiǎng)?chuàng)建一個(gè)新的HTML5文件并編寫(xiě)基本的HTML5代碼。
2. 創(chuàng)建一個(gè)新的div標(biāo)記,并在div標(biāo)記下面寫(xiě)一個(gè)button標(biāo)記。
3. 填寫(xiě)div標(biāo)簽和button標(biāo)簽的基本樣式代碼。這里我們將div的背景設(shè)置為紅色,以便更好地查看居中情況。
4. 當(dāng)我們用瀏覽器打開(kāi)頁(yè)面時(shí),我們可以看到div層中按鈕的左上角。
5. 下一步是實(shí)現(xiàn)垂直中心法。首先,我們將div的行高設(shè)置為div層的高度,并將button的垂直對(duì)齊屬性設(shè)置為middle。
6. 刷新頁(yè)面,發(fā)現(xiàn)按鈕在Div中垂直居中。