inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지

HTML 코드 구조 파악하기

Macos) 강사님 입력화면과 제 화면이 달라요

245

충실한 숭어
0

- 서로 예의를 지키며 존중하는 문화를 만들어가요.
- 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.
 
Mac 운영체제 사용중인데 혹시 저랑 같은 현상 겪고 계신분들께 도움이 될까 싶어서 적어봅니다.
 
 
들여쓰기는 VScode 하단에 'space' 혹은 '공백'을 눌러 바꿀 수 있구요.
 
xhtml 문법 적용은 json파일 수정이 필요한데
cmd + , 단축키혹은 직접조작으로 설정에 진입하셔서
1. 검색창에 'launch'검색
2. 'settings.json에서 편집' 클릭
그러면 json파일이 편집기에서 열리고
"launch": {
 
"configurations": [],
"compounds": []
}
이런게 쓰여있는데 이건 방금 json파일 접근하면서 작성된 내용이니 지우시면 됨.
(json파일에 쉽게 접근하려고 엄한 설정 건드려서 그런것이므로 딱 저부분만 지우시면 됩니다.)
 
3. 아래에 적힌 코드 추가
"emmet.syntaxProfiles": {
"html": "xhtml"
},
혹시라도 빨간줄 뜨면 바로 윗코드 마지막에 ','쉼표 있는지 확인해보세요
 
 
 
 
 
 
근데 이렇게 세팅해도 살짝 다른부분이 있는데
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
 
</body>
</html>
이게 제가 느낌표 하나로 불러온 html 틀이고
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body></body>
</html>
이게 강사님 화면입니다.
<html></html> 로 싸여있는 코드들이 들여쓰기 되었다는 점에서 차이를 보이는데 혹시 다른 설정이 있는걸까요?
 
네이버나 다음같은 웹사이트에서 개발자도구로 살펴보아도 기본적으로 html내부에 들여쓰기가 되어있는데 제 환경에서는 그렇게 되지 않아서 혹시 뭔가 설정이 잘못된건가 싶습니다.
 

답변 1

0

충실한 숭어

아.. 복붙하니 들여쓰기 다 망가졌네요 ㅜ

0

Jay

안녕하세요!

기본적으로 vscode에서는 mac이든 window든 설정을 건들이지 않아도

! 또는 html5 으로 자동완성 시킬 수 있는 것으로 알고 있어요!

이렇게 vscode 하단에 기본 언어모드가 HTML인지 확인해보시면 좋을 것 같습니다