0
我无法弄清楚为什么我的按钮样式会在运行safari的笔记本电脑上发生变化,而在这种情况下运行safari的手机是这样。为什么我的笔记本电脑和手机的按钮样式发生了变化
HTML代码:
<div id="img_container">
<img src="../assets/images/hotdrinks.png" style="hight:50%;">
<button class="button" onClick="parent.location='hotdrinks.html'"> Hot Drinks Menu </button>
</div>
<div id="img_container">
<img src="../assets/images/craftbeer.png" style="hight:50%;">
<button class="button" > Craft Club </button>
</div>
CSS代码:
#img_container {
position:relative;
display:inline-block;
text-align:center;
}
.button {
position:absolute;
bottom:10px;
right:10px;
width:200px;
height:50px;
font-family: test;
color: #000000;
text-transform: uppercase;
font-size: 40px;
}
由于您没有更改按钮的默认外观,所以根据您使用的浏览器不同,它会有所不同。 – the4kman
为了避免将来的元素和浏览器出现这个问题,请使用Normalize.css(https://necolas.github.io/normalize.css/) –