본문 바로가기
Next.js

Next.js(React)에서 한줄, 속성에 직접 style주는법

by flykimjiwon 2022. 3. 22.
반응형
function R1(props){
  
  // return(
  //   <div>hihi {props.ramen1}</div>
  // )
  if(props.ramen1===0){
    return <div style={{display:"inline"}}></div>
  }else if(props.ramen1===1){
    return <div style={{display:"inline"}}><img src="icon/bongji.png" width={45}></img></div>
  }else if(props.ramen1===2){
    return <div style={{display:"inline"}}><img src="icon/cup.png" width={45}></img></div>
  }
}

Next.js 에서는 style jsx로 CSS속성을 주는데

 

이와같이 급하게 ? 혹은 간단하게 속성 에다가 직접적으로 css속성을 주는방법

 

<div style={{display:"inline"}}></div>

이와같이 주면된다.

style = {{}} 를 꼭주의하고 안에는 오브젝트 형태로 display:"inline"형태로 주면된다.

반응형