리엑트에서는 JSX 문법을 사용하기 때문에 기존 HTML 테그는 알아들을 수 없습니다.


HTML 은 위 사진처럼 잘 나오지만 리엑트에선 JSX 문법대로 변경해줘야 됩니다.
JSX 문법은 단어 앞부분마다 대문자로 표기(카엘 표기법)합니다. (예 : className , colSpan 등)

colspan 을 colSpan 으로 변경해 준 모습입니다.
단어의 앞부분을 대문자로 변경해주면 리엑트에서 정상적으로 사용 가능합니다.
궁금하신것이나 이해가 안되는 부분 , 오타 및 오류 부분은 지적 및 댓글 부탁드립니다.
감사합니다!