下面的代码，按钮只有一个样式设置，产生截然不同的按钮外观。不仅背景颜色发生了变化，而且边框样式，圆角和渐变也发生了变化。我想失去渐变并不是太令人惊讶，但其他人对我来说都是如此。有谁能解释为什么？以下代码的输出是可见的here。我找到了许多解决方案＆＃34;如何像默认一样设置按钮的样式，但为什么在尝试更改背景颜色时默认值会发生如此显着的变化？
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link href="favicon-index.ico" type="image/x-icon" rel="shortcut icon">
<link href="/style.css" type="text/css" rel="stylesheet">
</head>
<body>
<h1>test buttons</h1>
<input type="button" value="gradient">
<input type="button" value="background-color" style="background-color: #ff0;">
</body>
</html>
答案 0 :(得分：1)
它必须做一些浏览器呈现它们的方法。如果没有应用样式，则使用本机os样式。但是当应用样式时，它必须从头开始绘制它。由于您只设置背景值，因此从浏览器默认值中使用边框和其他样式属性。
在每个操作系统和浏览器上，原生按钮看起来有点不同，但是相同的样式看起来相同。