Question

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

   <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>

这是我的个人资料类型的CSS代码

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

，并且我已经附上了当前图片。谢谢！：

current image

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' />

从CSS按钮删除轮廓

1 个答案: