Question

当我将鼠标悬停在background-color上时，我想更改color和#startButton。但是，我当前的代码（下面）没有任何变化。

#startButton:hover {
  color: blue;
  background-color: #fff;
}

<a href='#arrow' class='startButton' style='background-color: #fff; color: #555;' id='brickButton'>
  <span id='theText'>Start Your Search</span>
</a>

Answer 1

使用此CSS代替，因为startButton是一个不是ID的类。

unmarshal

Answer 2

将您的CSS更改为

public class Answer
{
    [Key]
    public int id { get; set; }

    [Required]
    public string answer { get; set; }

    [Required]//which question does this answer belong to
    public int questionId { get; set; }

    public List<int> DependentQuestions { get; set; }

    public Answer()
    {
        using (dbSurvey db = new dbSurvey())
        {
            var _list = db.Questions.Where(q => q.DependentAnswer == id).Select(q => q.id).ToList();
            if (_list.Any())
            {
                DependentQuestions = _list;
            }
            else
            {
                DependentQuestions.Add(0);
            }
        }
    }
}

或

#brickButton>span:hover {
color: blue;
background-color: #fff;
}

Answer 3

使用以下CSS：

.startButton span:hover {
color: blue;
background-color: #fff;
}

JSFiddler：https://jsfiddle.net/z34g50sc/2/

Answer 4

首先#用于id ...使用.符号表示元素class

如果您使用.，您的代码将无效，因为内联css首先出现...所以尝试删除内联css并将其写入单独的css文件中，就像您编写了:hover代码一样...

如果未更改:hover

之类的值，也无需在background-color上编写相同的css属性

.startButton {
  background-color: #fff;
  color: #555;
}

.startButton:hover {
  color: blue;
}

<a href='#arrow' class='startButton' id=' brickButton '>
  <span id='theText '>Start Your Search</span>
</a>

悬停不在嵌套SPAN上工作

4 个答案: