单击

Question

伙计我不知道如何解决或解释这个问题，我尝试在Google上搜索但无法找到解决方案。看一下附图。

基本上是一个输入字段，type = submit。点击它时，它会如图所示展开。当在外面点击时，它会恢复到原来的形状。知道为什么会这样。 HTML和CSS非常简单。

<input class="buynowsml" type="submit" value="Buy now" />

.buynowsml {
   border:none;
   border-radius:2px;
   -moz-border-radius:2px;
   -webkit-border-radius:2px;
   border:1px solid #00a6eb;
   font-size:12px;
   background:#fff !important;
   color:#00a6eb !important;
   font-family: "Gotham Medium",Arial,Helvetica,sans-serif;  
   outline: none;
   margin:0;    
}

之前我曾遇到过input type = text这个问题。现在我面对的是type = submit。伙计们好吗？感谢。

Answer 1

似乎有一些针对提交按钮的CSS：焦点状态。单击该按钮可使其聚焦并单击以移除焦点。这似乎与您描述的行为一致。

您可以使用Chrome的开发人员工具查看在不同状态下应用的样式。有关说明，请参阅See :hover state in Chrome Developer Tools