nextJs css 적용 방법들

Darcy Daeseok YU ·2022년 12월 9일
0

module.css

target_file_name.module.css

.userNm{
 color: blue; 
}

.host{

font-weight: bold;

}

Usage

import styles from './NavBar.module.css'


return <>


	<p style={[styles.userNm , styles.host].join(' ') }> 

	// or 
    
    <p className={`${styles.userNm} ${styles.host}`}> 
	

</>

styled jsx

return <>


	<p className="userNm host" > 

	// or 
    
    <p className="userNm"> 
	
    <style jsx>{` //백팁
    
    .userNm{
       color: blue; 
      }

	.host{

       font-weight: bold;

      }
      
    p {    	
       font-style: italic;    
    }

    
    
    
    `}</style>

</>
profile
React, React-Native https://darcyu83.netlify.app/

0개의 댓글