[HTML] 기본 구조

HTML 기본구조 알기 😊

안녕하세요!

솔직히 VSCode나 Atom 등등 다른 프로그램을 사용 하실 경우 ! + Tab 바를 누르면 틀이 만들어져 따로 생각을 안하게 됩니다.

프로그램을 안사용하시고 메모장을 쓰시는분은 암기해야 하겠지만... 대부분은 사용하실거라 생각합니다.

이제 부터 시작하겠습니다. 정말 간단하게 설명해드리겠습니다.

<!DOCTYPE html>
<html lang="ko">
 <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>
  <h1>궁시렁 궁시렁</h1>
  <p>어쩌구 저쩌구</p>
 </body>
</html>

가장 기본적인 HTML 구조를 보여드렸습니다. ! + Tab을 사용하시면 언어부분은 자동으로 en으로 되어있습니다. ko(한국어)로 바꿔적어주시면 됩니다. 끝!

<body>
    <header>
     머리
    </header>
    <main>
     몸
    </main>
    <footer>
     다리
    </footer>
</body>

저는 html를 3구간으로 나누어 사용합니다. 작업하기 편하기 위해서 입니다. 하고싶으신거 있다면 그냥 아무렇게나 하세요. 정답은 없다고들 하니깐요 ╰(*°▽°*)╯

저는 이제 작업을 할때 추가적으로 css와 javascrip (파일은 직접 아무렇게 만드세요)를 추가해줍니다.

.
.
 <head>
  <link rel="stylesheet" href="style.css">
 <head>
 <body>
  <script src="script.js"></script>
 </body>
 .
 .

진짜 끝!

그럼 이제 뭐라도 만들어볼까요?

앞으로 저는 Clicker Game 만들고 싶으니 그거를 제작하면서, 이것 저것 그림도 넣어보고 제작하는 과정을 포스팅 해보겠습니다.

※ 주의!

많이 서투른 점 감안하고 지켜봐주시면 감사하겠습니다.

저도 따라 배우는 것이기에 다른곳에서 매우 비슷한 코드를 접할 수 있습니다.

틀린 부분과 다른 좋은 방법이 있다면 댓글로 남겨주시면 고쳐 보도록 하겠습니다.

'HTML,CSS,JavaScript > HTML,CSS,JAVASCRIPT' 카테고리의 다른 글

[HTML] input 활용하기 (0)	2022.11.02
[HTML] 주석 활용하기 (0)	2022.11.01
[HTML] li 점 없애기 + 변경해보기 (0)	2021.11.12
[HTML] a 태그 밑줄 없애기 (0)	2021.11.11
[css] 1. css 편의성, 디자인, 참고자료 준비하기 (0)	2021.10.28

배웠다 말았다 다시 시작했다😎

[HTML] 기본 구조