html - Css 悬停自定义到 xml

Question

我有这样的(部分)CSS:

.my_content{

   background-image : url("../icons/my_small_corner.png");
    background-position : top left;
   background-repeat : no-repeat;
    border-style: solid;
    border-bottom-width: 3px;
   border-top-width: 3px;
    border-left-width: 3px;
    border-right-width: 3px;
    border-color: #241882; 
    background-color: #0071C5; opacity: .3;
   /* float : none; */
    text-align: left;
    position: absolute;
    top : 25%;
    left : 30%;
   width : 20%;
    height : 25%;
}

#text_c .text {
    font-size: 17pt;
    color: #0066FF;
}

这是我使用的 xml(不是 html!因为我正在自定义 eclipse 欢迎页面):

  <group id="text_c" style-id="my_content">
     <group id="page-links" >
        <text>My text!!!!!</text>
     </group>
  </group>

绘制一个矩形，每个矩形的边框为 3px，没问题!

如果鼠标经过它，我想将边框突出显示为 7px(例如)!我尝试了这个但没有成功:

.my_content:hover {

    border-bottom-width: 10px;
   border-top-width: 10px;
    border-left-width: 10px;
    border-right-width: 10px;
}

Answer 1

你的 CSS 文件中的 my_content 类定义，是否有:

my_content:hover{}

或

.my_content:hover{}

如果缺少句点字符 . 可能会阻止 hover css 的执行。您上面的代码片段没有句点 . 字符。不确定这是否只是复制/粘贴错误。