Question

我有一个表格标签如下：

<label id="jform_email-lbl" for="jform_email" class="hasTip required" 
title="Email Address::Please enter the email address associated with your User 
account.&lt;br /&gt;A verification code will be sent to you. Once you have 
received the verification code, you will be able to choose a new password for 
your account.">Email Address:<span class="star">&#160;*</span></label>

我想为我的popover'title'元素（＃000）应用不同的样式。

不是表单上显示的“电子邮件地址：”标签（即#fff）。

以为我可能会做以下事情，但它不起作用：

label#jform_email-lbl[type="title"] { 
    color: #000; 
}

**** ** EDITED 答案如下 - 对于其他任何试图找到合适的css的人：**

div.tip .tip-title {
   color: #E77600 !important;
   font-weight: bold;
}
div.tip .tip-text {
   color: #979797 !important;
   font-weight: bold;
}

Answer 1

稍后编辑，我理解了这个问题：

<!DOCTYPE html>
<html>
<head>
<style>
label {
  color: #900;
  text-decoration: none;
}

label:hover {
  color: red;
  position: relative;
}

label[title]:hover:after {
  content: attr(title);
  padding: 4px 8px;
  color: red;
  position: absolute;
  left: 0;
  top: 100%;
  white-space: nowrap;
  z-index: 20px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-box-shadow: 0px 0px 4px #222;
  -webkit-box-shadow: 0px 0px 4px #222;
  box-shadow: 0px 0px 4px #222;
  background-image: -moz-linear-gradient(top, #eeeeee, #cccccc);
  background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #eeeeee),color-stop(1, #cccccc));
  background-image: -webkit-linear-gradient(top, #eeeeee, #cccccc);
  background-image: -moz-linear-gradient(top, #eeeeee, #cccccc);
  background-image: -ms-linear-gradient(top, #eeeeee, #cccccc);
  background-image: -o-linear-gradient(top, #eeeeee, #cccccc);
}


</style>
</head>

<label id="jform_email-lbl" for="jform_email" class="hasTip required" title="something">Email Address:<span class="star">&#160;*</span></label>

</html>

如何将css样式应用于标签的弹出标题元素

1 个答案: