然后确保a从其父节点继承颜色：

li:hover a {
    color: inherit;
}

或者指定一个选择器来显式地将相同的颜色应用于a元素：

#nav ul li:hover,
#nav ul li:hover a {
  margin-left: -10px;
  padding-left: 10px;
  background-color: #13118C;
  color: white; 
  font-weight: bold;
  width: 100%;
}

当然，你也可以让a填充li元素，使用：

#nav ul li a {
    display: block;
}

如果您为li指定了一个高度，那么使用相同的高度（使用之前的display: block规则），a也将在li内垂直居中，例如：

#nav ul li {
    height: 2em; /* or whatever, adjust to taste... */
}
#nav ul li a {
    display: block;
    line-height: 2em;
}

虽然li的padding不会包含在指定的高度内（它将是元素的高度，加上填充加上边框宽度），所以a周围会有一个空的空间，除非您指定（对于兼容的浏览器）box-sizing: border-box;将border和padding包含在指定的高度中。

别紧张！

#nav li a {
  color: white;
}

/* When hovering over li, apply styles to child a */
#nav li:hover a {
  color: blue;
}

上面有很多很好的建议，但我想提一下为什么你的CSS规则不起作用的原因，这是因为特定性。您定义的每个CSS选择器都有一个计算的特异性，您可以在这里阅读。这些值用于确定哪些规则优先于其他规则。http://www.w3.org/TR/css3-selectors/#specificity. Those values are used to determine which rules take precedence over others.
请注意，继承的选择器的特异性为0，这在您的情况下很重要。

#nav ul li { color: #000; }
#nav ul li a { color: #800; }      // This has a specificity of 103 when applied to <A> elements
#nav ul li:hover { color: #080; }  // This has a specificity of 0 when applied to <A> elements because it is inherited from the parent <LI> element.

示例：http://jsfiddle.net/rg4fN/
通过将a元素附加到最后一个选择器，当应用于元素时，它将不再被继承。它现在具有比其他选择器更高的特异性，因此将优先。

#nav ul li a { color: #800; }        // This has a specificity of 103 when applied to <A> elements 
#nav ul li:hover a { color: #080; }  // This has a specificity of 113 when applied to <A> elements

示例：http://jsfiddle.net/NxT29/

尝试这样的东西

#nav li a 
{
  margin-left: -10px;
  padding-left: 10px;
  background-color: #13118C;
  color: white; 
  font-weight: bold;
  width: 100%;

}

将样式应用于子级

#nav li:hover a 
{
 margin-left: -10px;
 padding-left: 10px;
 background-color: #13118C; 
 font-weight: bold;
 width: 100%;
 color: blue;
 }