添加css边框样式

Question

有人可以帮助我吗？我想在链接中添加边框样式：hover，到primefaces的一个组件。 我这样添加：

.ui-contextmenu .ui-menuitem-link:hover{
  font-weight: bold;
  border-style: solid;
  border-width: thin;
}

在调用 pfcrud.css。的文件中 问题是，边框样式不起作用/显示。 谢谢！

Answer 1

可能是你想尝试的：

.ui-contextmenu .ui-menuitem-link:hover{
  font-weight: bold;
  border: 1px solid #a32ddf
}

更新了bucurvad的小提琴：https://jsfiddle.net/upq3045g/3/

有关border at http://www.w3schools.com/css/css_border.asp

的更多信息

Answer 2

使用速记方法：border: thin solid black;

<强> CSS

.ui-contextmenu .ui-menuitem-link:hover{
  font-weight: bold;
  border: thin solid black;
}

请注意，这将更改相关元素的框模型，因此当您将鼠标悬停在其上时，此边框将有效地增加元素大小。您可能需要考虑通过为元素的自然/默认状态声明规则来适应该更改，通常是具有相同宽度的边框，但transparent在大多数情况下都有效。

Answer 3

您是否尝试过使用

.ui-contextmenu .ui-menuitem-link:hover {
border-style: solid black 2px;
}

这个例子好吗？ https://jsfiddle.net/upq3045g/2/