从 CSS 按钮中删除轮廓[重复]

Question

目前，我的下拉菜单中的按钮在每个按钮周围显示黑色轮廓（如图所示），但我正在尝试删除它们，以便按钮看起来与背景更加融合（或者使轮廓变为白色），以便你看不到它。这是我当前的 HTML 代码

.profiletype {
  background-color: white;
  font-weight: 300;
  letter-spacing: 1px;
  color: black;
  cursor: pointer;
  text-transform: uppercase;
  margin: 5px;
  text-align: center;
}

<input type="button" className = 'profiletype' name="profile_type" value={name} onClick={submit}>Social</input>
<input type="button" className = 'profiletype' name="profile_type" value={name} onClick={submit}>Professional</input>

我已附上当前外观的图像：

Answer 1

关于该大纲 - 它是浏览器应用的

input type="button"

的默认样式。要修复它，您可以声明自己的边框样式。例如：

border:1px solid blue;

.profiletype {
  background-color: white;
  font-weight: 300;
  letter-spacing: 1px;
  color: black;
  cursor: pointer;
  text-transform: uppercase;
  margin: 5px;
  text-align: center;
  border:1px solid blue;
}

<input type="button" class = 'profiletype' name="profile_type" value='Professional' />
 <input type="button" class = 'profiletype' name="profile_type" value='Social' />