Css样式没有!重要 - 如何做到这一点?

时间:2016-09-12 11:37:16

标签: html css

我希望在 try { QueryExpression notes = new QueryExpression { EntityName = "annotation", ColumnSet = new ColumnSet("filename", "subject", "annotationid", "documentbody","mimetype") }; notes.Criteria.AddCondition("annotationid", ConditionOperator.Equal, annotationid); EntityCollection NotesRetrieve = service.RetrieveMultiple(notes); if (NotesRetrieve != null && NotesRetrieve.Entities.Count > 0) { foreach (var note in NotesRetrieve.Entities) { string fileName =note.GetAttributeValue<string>("filename"); string cleanFileName = string.Empty; foreach (var chr in fileName.ToCharArray().ToList()) { if (!Path.GetInvalidFileNameChars().Contains(chr)) cleanFileName = cleanFileName + chr; } FileIOPermission writePermission = new FileIOPermission(FileIOPermissionAccess.AllAccess, @"D:\note"); writePermission.Demand(); string filePath = Path.Combine(@"D:\note", cleanFileName); byte[] fileContent = Convert.FromBase64String(NotesRetrieve.Entities[0].Attributes["documentbody"].ToString()); System.IO.File.WriteAllBytes(filePath, fileContent); } } } catch (Exception ex) { throw new InvalidPluginExecutionException(ex.ToString()); } 列表中为a项添加样式,方法是在其中添加名为li的特定类。

除非我使用.list-click,否则我的代码无效。

我想避免使用它,所以也许有人知道如何解决我的问题。我没有使用任何可以覆盖我的CSS的js脚本或者像这样。

&#13;
&#13;
!important
&#13;
.portfolio-menu {
  list-style: none;
  width: 200px;
  margin: 0;
  padding: 0;
}
.portfolio-menu li {
  text-transform: uppercase;
  text-align: left;
  margin-bottom: 30px;
  font-weight: bolder;
  font-size: 1.2em;
}
.portfolio-menu li a {
  text-decoration: none;
  color: #4d4d4d;
}
.portfolio-menu li a:hover {
  cursor: pointer;
  color: #2e2e2e;
}
.portfolio-menu li a:focus {
  color: #2e2e2e;
}
.list-click {
  color: red !important;
}
&#13;
&#13;
&#13;

3 个答案:

答案 0 :(得分:2)

您需要be more specific

.portfolio-menu li a.list-click更具体,因此无论您将哪种顺序放在样式表中,它都会获胜。

.portfolio-menu li .list-click {
    color: red
}

示例:

&#13;
&#13;
.portfolio-menu{
  list-style: none;
  width: 200px;
  margin: 0;
  padding: 0;
}
.portfolio-menu li {
  text-transform: uppercase;
  text-align: left;
  margin-bottom: 30px;
  font-weight: bolder;
  font-size: 1.2em;
}

.portfolio-menu li a{
  text-decoration: none;
  color: #4d4d4d;
}

.portfolio-menu li a:hover{
  cursor: pointer;
  color: #2e2e2e;
}
.portfolio-menu li a:focus{
  color: #2e2e2e;
}

.portfolio-menu li .list-click{
  color: red;
}
&#13;
<ul class="portfolio-menu">
  <li><a href="#portfolio" class="list-click">all</a></li>
  <li><a href="#portfolio">logo</a></li>
  <li><a href="#portfolio">icons</a></li>
</ul>  
&#13;
&#13;
&#13;

答案 1 :(得分:0)

list-click使用更优选/特定的选择器,这将有效:

.portfolio-menu li a.list-click{
  color: red;
}

以下片段:

&#13;
&#13;
.portfolio-menu{
  list-style: none;
  width: 200px;
  margin: 0;
  padding: 0;
}
.portfolio-menu li {
  text-transform: uppercase;
  text-align: left;
  margin-bottom: 30px;
  font-weight: bolder;
  font-size: 1.2em;
}

.portfolio-menu li a{
  text-decoration: none;
  color: #4d4d4d;
}

.portfolio-menu li a:hover{
  cursor: pointer;
  color: #2e2e2e;
}
.portfolio-menu li a:focus{
  color: #2e2e2e;
}

.portfolio-menu li a.list-click{
  color: red;
}
&#13;
<ul class="portfolio-menu">
  <li><a href="#portfolio" class="list-click">all</a></li>
  <li><a href="#portfolio">logo</a></li>
  <li><a href="#portfolio">icons</a></li>
</ul>  
&#13;
&#13;
&#13;

让我知道您对此的反馈。谢谢!

答案 2 :(得分:0)

只需使用不含!important的以下代码即可:

.portfolio-menu li a.list-click{
  color: red;
}