CSS类选择器不工作 [英] CSS class selector not working

问题描述

我正在尝试使用HTML和CSS制作自定义提醒框。容器的ID为 xAlert ，其中有3个 div s：一个用于标题，一个用于描述，以及一个用于操作（如确定或取消）。这是我的代码到目前为止：

  #xAlert {width：368px; / * 400-16 * 2 * / max-height：200px;左：50％;保证金左：-200px;位置：绝对的;溢出：汽车;边框：1px纯黑色;如果您使用的是HTML代码，那么您可以使用以下代码：
 
 
 
 $ c>< div id =xAlert> < div class =alertTitle>警示标题< / div> < div class =alert_description>警报说明< / div> < div class =alert_actions>警报操作< / div> < / div>  

正如您所看到的， （ .alertTitle ）没有20px的字体大小。我尝试使用内联CSS，它工作，我删除了CSS的 #xAlert ，它工作，但为什么这不工作？

解决方案

通过验证器运行您的代码说：

第9行第2列的词汇错误。遇到：\\\（127），在：}之后。 alertTitle {font-size：20px; }

在第一个} 后面有一个看不见的字符作为以下选择器的（无效）部分。删除它。

I am trying to make a custom alert box using HTML and CSS. The container has the id "xAlert" and has 3 divs in it: one for the title, one for the description, and one for the actions (like OK or Cancel). Here is my code so far:

#xAlert{
  width:368px; /* 400-16*2 */
  max-height:200px;
  left:50%;
  margin-left:-200px;
  position:absolute;
  overflow:auto;
  border:1px solid black;
  padding:16px;
}

.alertTitle{
  font-size:20px;
}

  <div id="xAlert">
    
    <div class="alertTitle">
      Alert Title
    </div>
    
    <div class="alert_description">
      Alert Description
    </div>
    
    <div class="alert_actions">
      Alert Actions
    </div>
    
  </div>

As you can see, the alert title (.alertTitle) does not have the font size of 20px. I tried using inline CSS and it worked, and I removed the CSS for #xAlert and it worked, but why is this not working?

解决方案

Run your code through a validator which says:

Lexical error at line 9, column 2. Encountered: "\u007f" (127), after : "" } .alertTitle{ font-size:20px; }

You have an invisible character just after the first } which is treated as an (invalid) part of the following selector. Delete it.

这篇关于CSS类选择器不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！