jsFiddle을 사용해 HTML 작성하기
jsFiddle을 이용해 아주 쉽게 작성하고 결과를 확인할 수 있습니다.또한 HTML, CSS, JavaScript 코드를 jsFiddle에서 작성한 후에 다른 사람들과 공유할 수 있습니다!!
다른 사람과 공유하고 싶다면 jsFiddle에서 작성한 후 윗 부분에 ‘Embed’ 부분을 클릭 한 후 ‘Embed snippet’ 에서 공유 소스코드를 확인 할 수 있습니다. 이 코드를 다른 사람에게 보내거나 자신의 홈페이지 에서 사용하실 수 있습니다.
1 | jsFiddle 공유 소스 |
만약 Hexo Blog를 통해 공유하신다고 한다면 jsFiddle에서 작성한 후 윗 부분에 ‘Embed’ 부분을 클릭 한 후 ‘Embed snippet’ 에서 공유 소스코드를 확인 하신 후 ‘shorttag’ 부분에서 jsfiddle.net/ 뒤에 오는 문자를 사용하시면 됩니다.
1 | {% jsfiddle szktx0gb html,css,result %} |
HTML 메모장으로 작성하기
메모장으로 HTML을 작성해봅시다. 누구나 다 가지고 있는 메모장을 이용해 html을 작성하고 실행할 수 있습니다. (메모장에 이런 기능이 있는지 몰라서 가져와 봤습니다.)
컴퓨터의 시작 버튼을 누르고 메모장을 검색하여 메모장을 실행합니다.
아래에 제가 작성한 HTML 태그를 복사해 메모장에 붙여 넣습니다.
1 | <!DOCTYPE html> |
- 저장을 합니다.
메모장의 파일 버튼을 누르고 다른 이름으로 저장을 누릅니다.
파일의 이름을 “index.html”로 작성하고 저장 버튼 왼쪽의 인코딩 설정을UTF-8
로 해주세요.
- 저장한 html 파일을 열어 봅시다.

따라하시느라 수고하셨어요!! 앞으로도 메모장을 이용해 HTML결과를 쉽게 확인 하실 수 있어요.