React中的CSS伪元素

JavaScript React.js

古一Mandy

2020-03-19

我正在构建React组件。正如React背后的一位专家在本次精彩的演讲中所建议的那样，我已经在组件中添加了CSS内联。我一直在努力寻找一种方法来内联添加CSS伪类，就像在演示文稿中名为“ :: after”的幻灯片上一样。不幸的是，我不仅需要添加该content:"";属性，还需要添加该属性position:absolute; -webkit-filter: blur(10px) saturate(2);。幻灯片显示了如何通过添加内容{/* … */}，但是如何添加其他属性？

第2245篇《React中的CSS伪元素》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

共1个回答
GO凯 2020.03.19

取决于是否只需要对几个属性进行内联样式设置，就可以执行以下解决方案（使您不必安装特殊的程序包或创建额外的元素）：

https://stackoverflow.com/a/42000085

<span class="something" datacustomattribute="👋">
  Hello
</span>

.something::before {
  content: attr(datascustomattribute);
  position: absolute;
}

请注意，datacustomattribute必须以开头，data并且全部使用小写字母才能满足React的要求。

相似问题

0 回答

0 回答

5 回答

25 回答

0 回答

0 回答

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android