Question

我正在React应用程序中工作，并且具有一个可呈现大量span标签的组件。这些标签都有不同的类名，并从链接的样式表中接收所有样式。除了一个类，下面显示为actions。由于某种原因，我无法弄清楚如何通过样式表更新这一类。

如果我使用Chrome Dev工具并将样式更改为actions，则将呈现更改。如果我在组件中创建一个customStyle对象，并应用actions并带有指向该对象的style属性，则该类将按照预期的样式设置。

但是，如果我向actions span标签添加ID并尝试从链接的样式表中进行样式设置，问题就会再次出现，并且我的自定义样式均不会应用于actions。我尝试删除actions类的所有样式，只渲染background-color的{{1}}，但即使这样也不会。

是否可能由于某些原因而使我无法通过该样式表对该组件中的所有其他类进行样式设置，但是red不能？

在此先感谢您的答复，请告知我是否还有其他信息。

下面是组件代码：

actions

我已经彻底浏览了样式表，并且该类仅被引用一次。下面是我尝试过的不会更新的类的示例代码：

import React from 'react';

const ListHeaderComponent = (props) => {  
  return (
    <span className='header'>
      <span className='subheader'}>
        <span className='content'>
          Hello
        </span>
      </span>
      <span className='subcontent'>
        This is where the content goes
      </span>
      <span className='actions' id="what">
        This is where the actions go
      </span>
    </span>
  );
};

export default SplitViewListHeader;

Answer 1

CSS脚本在指向元素ID时非常特别。它只会指向该元素，而不会影响嵌套序列。这就是为什么它们仅用于指向具有独立功能的非常具体的元素的原因；或只是使用一个名字。我认为这就是id无法使用的原因。

Answer 2

如果使用class =“”而不是className =“”会发生什么？

样式表样式不适用于某一特定样式

2 个答案: