背景圖片疊加問(wèn)題，大神給指?jìng)€(gè)路_html/css

來(lái)源：懂視網(wǎng) 責(zé)編：小采時(shí)間：2020-11-27 16:36:51

背景圖片疊加問(wèn)題，大神給指?jìng)€(gè)路_html/css

背景圖片疊加問(wèn)題，大神給指?jìng)€(gè)路_html/css_WEB-ITnose:問(wèn)題：有個(gè)大的背景圖（A）放在最外層的div，然后這個(gè)div里面有個(gè)table下面的input，就是登錄按鈕，這個(gè)登錄按鈕也有個(gè)背景圖（B），這個(gè)背景圖B不是矩形的，是有圓角的，美工跟我說(shuō)圓角是透明的，讓我自己調(diào)一下，可是我設(shè)置了寬度和高度之后，圓角的部分沒(méi)

推薦度：

點(diǎn)擊下載本文 文檔為doc格式

導(dǎo)讀背景圖片疊加問(wèn)題，大神給指?jìng)€(gè)路_html/css_WEB-ITnose:問(wèn)題：有個(gè)大的背景圖（A）放在最外層的div，然后這個(gè)div里面有個(gè)table下面的input，就是登錄按鈕，這個(gè)登錄按鈕也有個(gè)背景圖（B），這個(gè)背景圖B不是矩形的，是有圓角的，美工跟我說(shuō)圓角是透明的，讓我自己調(diào)一下，可是我設(shè)置了寬度和高度之后，圓角的部分沒(méi)

問(wèn)題：有個(gè)大的背景圖（A）放在最外層的div，然后這個(gè)div里面有個(gè)table下面的input，就是登錄按鈕，這個(gè)登錄按鈕也有個(gè)背景圖（B），這個(gè)背景圖B不是矩形的，是有圓角的，美工跟我說(shuō)圓角是透明的，讓我自己調(diào)一下，可是我設(shè)置了寬度和高度之后，圓角的部分沒(méi)有透明，而是出現(xiàn)白色的底色，現(xiàn)在想把白色的邊角部分去掉，請(qǐng)教各位，怎么把邊角的部分設(shè)置透明。

PS：圖b是圓角的一個(gè)圖，不是矩形的，設(shè)置寬高之后，圖片沒(méi)填滿(mǎn)的部分有底色，不透明，我想要透明，即顯示圖A的背景色。

		......	.....

.login-cultural-lib { 	cursor: default; text-align:left; 	width:899px; 	height:507px; 	background: url(../images/login/login-bg-culturallib.png);}.login-btn { width: 98px; height: 98px; background-image: url(../images/login/login-btn.png); cursor: pointer; border: 0px}

我想要的效果：

實(shí)際效果：

回復(fù)討論(解決方案)

你這樣寫(xiě)沒(méi)什么問(wèn)題，好好檢查一下圖片是否是圓角透明的。
然后我想吐槽一下，美工做完后就這個(gè)樣子么~這美工也太水了吧~

		......	.....

.login-cultural-lib { 	cursor: default; text-align:left; 	width:899px; 	height:507px; 	background: url(../images/login/login-bg-culturallib.png);}.login-btn { width: 98px; height: 98px; background-image: url(../images/login/login-btn.png); cursor: pointer; border: 0px}

我想要的效果：

實(shí)際效果：

		......	.....

.login-cultural-lib { 	cursor: default; text-align:left; 	width:899px; 	height:507px; 	background: url(../images/login/login-bg-culturallib.png);}.login-btn { width: 98px; height: 98px; background-image: url(../images/login/login-btn.png); cursor: pointer; border: 0px}

我想要的效果：

實(shí)際效果：

美工做出來(lái)的效果還行，但是切完圖放進(jìn)來(lái)就就這樣了，圓角應(yīng)該是透明的，我在login-btn這個(gè)類(lèi)里面設(shè)置了寬高，沒(méi)充滿(mǎn)的部分不透明啊！是不是要設(shè)置透明度什么的，我設(shè)置了都不行，實(shí)在不行就只能讓美容重新切圖了

不是透明度的問(wèn)題，都說(shuō)了你仔細(xì)檢查一下這張圖片，白色部分到底是透明的還是白色的~

是透明的。。

不是透明度的問(wèn)題，都說(shuō)了你仔細(xì)檢查一下這張圖片，白色部分到底是透明的還是白色的~

是透明的。。

如果真是透明的，你就好好檢查它的父級(jí)元素有沒(méi)有設(shè)定背景顏色，你這按鈕的樣式寫(xiě)得是沒(méi)有什么問(wèn)題的。
再給你一個(gè)免費(fèi)的小建議，用不到透明圖片的地方最好切成jpg格式圖片，png圖片會(huì)比jpg圖片大，這樣用戶(hù)加載起來(lái)會(huì)變慢。

不是透明度的問(wèn)題，都說(shuō)了你仔細(xì)檢查一下這張圖片，白色部分到底是透明的還是白色的~

是透明的。。

然而我只是單單把input元素給干掉，就沒(méi)有背景色了，加上去就特么的出來(lái)白色的邊角，心塞

實(shí)在不行就不要button控件么，直接用image，再給image加點(diǎn)擊事件

那是input在瀏覽器下的默認(rèn)樣式，重寫(xiě)一下樣式就好了。或者向樓上說(shuō)的一樣，用其他標(biāo)簽。

thx~~thx~~ 解決了，加了一個(gè)屬性就行了，background-color: transparent ，原來(lái)是input的默認(rèn)樣式，謝謝熱心回答，謝謝哈

聲明：本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí)，若有侵權(quán)等問(wèn)題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系，我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com