html，一排buttom里只有插入图片的正常，其余添加内容后都会下移；但button内都添加内容后恢复正常如图三
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Calculator</title><sty...
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Calculator</title> <style> *{ margin: 0; padding: 0; } ol,ul{ list-style-type: none; } .container{ background-color: #666; width: 800px; height: 1400px; margin: 300px 800px; border-radius: 50px; position: absolute; } .display{ width: 800px; height: 400px; text-align: right; font: 110px "微软雅黑"; color: #fff; position: absolute; } .display text{ position: absolute; right: 20px; bottom: 20px; } .key{ height: 1100px; width: 800px; position: absolute; top: 350px; margin-top: 50px; margin-left: 10px; border: 1px solid #000; } .key ul li button{ height: 170px; width: 170px; border-radius: 85px; background-color: #a5a5a5; /*border: 1px solid #000;*/ border: none; color: #fff; font-size: 70px; margin: 10px; } .key ul li .clear{ color: #000; } .key ul li .trans{ color: #000; background:url('img/3.png'); background-color: #a5a5a5; } .key ul li .percent{ color: #000; } .key ul li .zero{ width: 370px; } </style></head><body> <div class="container"> <!-- 显示区 --> <div class="display"> <text>321</text> </div> <!-- 按键区 --> <div class="key"> <ul> <li> <button class="clear">AC</button> <button class="trans">1</button> <button class="percent">%</button> <button class="opera">÷</button> </li> <li> <button class="num">1</button> <button class="num">2</button> <button class="num">3</button> <button class="opera">×</button> </li> <li> <button class="num"></button> <button class="num"></button> <button class="num"></button> <button class="opera"></button> </li> <li> <button class="num"></button> <button class="num"></button> <button class="num"></button> <button class="opera"></button> </li> <li> <button class="zero"></button> <button class="round"></button> <button class="opera"></button> </li> </ul> </div> </div></body></html>
展开
1个回答
展开全部
您好，非常荣幸能在此回答您的问题。以下是我对此问题的部分见解，若有错误，欢迎指出。使用背景图就可以了。。
1
<button>这是个按钮</button>
样式：
1
button {background:url(背景图片地址) no-repeat center center / 100% 50%}
然后使用 padding-top 控制文字的偏移非常感谢您的耐心观看，如有帮助请采纳，祝生活愉快！谢谢！
1
<button>这是个按钮</button>
样式：
1
button {background:url(背景图片地址) no-repeat center center / 100% 50%}
然后使用 padding-top 控制文字的偏移非常感谢您的耐心观看，如有帮助请采纳，祝生活愉快！谢谢！
追问
button {background:url(背景图片地址) no-repeat center center；写了之后位置没有变化；
加入了后面的代码后"/ 100% 50%"，图片就显示不出来了。
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
