相关疑难解决方法(0)

我正在使用内联CSS(即style属性中的CSS )制作HTML电子邮件签名,我很好奇是否可以使用:before和:after伪元素.

如果是这样,我将如何用内联CSS实现这样的东西？

td { text-align: justify; }
td:after { content: ""; display: inline-block; width: 100%; }

我有一个名为“ExplanationLists”的 React 组件，我想li使用 css 伪代码将动态内联样式添加到html 元素中li::after，这样我就可以更好地使用图形来设置项目符号的样式。例如，

li::before {
    content: dynamic_content;
}

但是，我无法真正做到这一点。任何建议将不胜感激。

下面是我写的代码。

class ExplanationLists extends Component{
    populateHtml(){
        // asign lists data into variable "items"
        var items = this.props.items; 

        // loop though items and pass dynamic style into li element
        const html = items.map(function(item){
            var divStyle = {
                display: "list-item",
                listStyleImage: 
                    'url(' +  
                    '/images/icons/batchfield_fotograf_rosenheim_icon_' + 
                    item.icon +
                    '.png' +
                    ')'   
            };  

            // html templating 
            return (
                 <li style={divStyle}>
                   <h3 >{item.title}</h3>
                   <p>{item.desc}</p>
                 </li>
            );
        });

        // return …

我想这样定义jsx：

<table style={{'--length': array.lenght}}>
   <tbody>
      <tr>{array}</tr>
   </tbody>
</table>

并且我在CSS中使用--length，也有一些单元格具有--count，它们使用css伪选择器（使用Counter hack）显示计数。

但打字稿显示错误：

TS2326: Types of property 'style' are incompatible.
  Type '{ '--length': number; }' is not assignable to type 'CSSProperties'.
    Object literal may only specify known properties, and ''--length'' does not exist in type 'CSSProperties'.

是否可以更改样式属性的类型以接受CSS变量（自定义属性），或者是否可以对样式对象进行强制？