更改:之前:将鼠标悬停在主DIV上？

Question

我有一个看起来像讲话泡泡的div.主要的div是泡沫和:之前是箭头.我想要做的是,当你:hover在CSS中翻转DIV时,它也会改变:before.

这是我的代码:

.sidebar_image_box_newsfeed_user_info_comments { 
    color: #ffffff; 
    background-color: #2f2f2e;
    text-decoration: none; 
    -webkit-transition-property: background-color, color, text-decoration; 
    -webkit-transition-duration: 0.5s, 0.5s, 0.5s; 
}

.sidebar_image_box_newsfeed_user_info_comments:hover { 
    background-color: #3b3b3b; 
    color: #f3f3f3; 
    text-decoration: underline; 
}

.sidebar_image_box_newsfeed_user_info_comments:before { 
    content:""; position:absolute;
    bottom:-6px; right:0;
    border-width:0 0 6px 6px;
    border-style:solid;
    border-color:transparent #2f2f2e;
    text-decoration: none;
    -webkit-transition-property: background-color, color, text-decoration;
    -webkit-transition-duration: 0.5s, 0.5s, 0.5s;
}

Answer 1

.sidebar_image_box_newsfeed_user_info_comments:hover:before {
   content: "I am new";
}

jsFiddle.