Question

无法找出所有系统和浏览器中按钮的显示方式，任何帮助吗？

截图： https://www.browserstack.com/screenshots/550281a9fe2a9b7d36614ec53391db509557c4f9

#contactus .container button {
height: 35px;
width: 35px;
background-color: #a4cbe3;
border:none;
padding: 0;
margin: 0;
outline: 2px dashed white;
color: white;
font-size: 30px;
position: relative;
top: 4px;
margin-right: 13px; }


<div class='container' id="gavejai">
<button onclick="addfield();" type="button">+</button>

Answer 1

浏览器在css渲染中仍然存在一些不一致，即使在不同操作系统之间使用相同版本的浏览器，也要确保定义了元素的所有css属性，它们之间可能不同。这是代码：

#contactus .container button {
  height: 35px;
  width: 35px;
  background-color: #a4cbe3;
  border:none;
  padding: 0;
  margin: 0;
  outline: 2px dashed white;
  color: white;
  font-size: 30px;
  position: relative;
  top: 4px;
  margin-right: 13px;

  /* add these styles */
  font-weight: 300;
  line-height: 35px; /* must be equal to height property */
  display: inline-block;
  vertical-align: middle;
}

[edit]我建议您在css代码顶部使用CSS重置，尝试消除此不一致http://html5doctor.com/html-5-reset-stylesheet/

Apple和Windows系统上的不同按钮样式

1 个答案: