我試圖添加兩個classname表單樣式，但是我不能在一個div中添加兩個CSS類。

下面是截圖:

我的代碼如下:

博客. js

...
import styles from '../styles/Home.module.css'
....
    <div className={styles.container}>
        <h2 >Recent Blogs</h2>
        <hr/>
        {blogs.map((data)=>{
          return <div key={data.slug}>
          <div className={'${styles.card} ${styles.canclick}'}>
          <Link href={`blogpost/${data.slug}`}><h3>{data.title}</h3>
          </Link>
          <em>{data.author}</em>
          </div>
          <p>{data.content.substr(0,200)}</p>
          </div>

Home.module.css

.canclick{ 
cursor: pointer; 
}

.card {
  margin: 1rem;
  padding: 1.5rem;
  text-align: left;
  color: inherit;
  text-decoration: none;
  border: 1px solid #eaeaea;
  border-radius: 10px;
  transition: color 0.15s ease, border-color 0.15s ease;
  max-width: 300px;
}

您需要對模板字符串使用反引號，而不是使用單引號:

// This works
`${styles.card} ${styles.canclick}`

// This won't work
'${styles.card} ${styles.canclick}'

更多的上下文請看這個

老弟你可以用class = & quot"并且className = & quot"對于相同的分區 如果你再次遇到這個問題，你可以試試這個片段: $ { styles . card } $ { styles . can click } 這里你的代碼和這段代碼的區別是 我的代碼有``而你的代碼有* * ' ' * *在開頭和結尾。 你可以在上面看到這個符號& quottab & quot只需點擊那個按鈕就可以享受了。

您應該嘗試像這樣添加您的類名。

單引號不會正確地添加類名，為此，您可以使用模板文字，如下所示:

${styles.card} ${styles.canclick}