HTML Reference

HTML 기초 문법

기본 문법

1. 태그라는 기능으로 코드를 작성한다
웹사이트 내용중에 태그로 범위를 구분할 수 있다

2. 부등호 < > 기호를 사용한다

3. 대부분 태그는 범위를 지정해야 한다(script src 속성을 사용하거나 link 태그 등은 제외)
" / " 기호를 사용해서 범위의 끝 부분을 나타낸다

<head>
    /* head 태그 범위 안의 내용 /*
</head>    " / " 기호로 head 태그의 범위 끝부분을 나타낸다>

4. 속성을 사용해서 태그의 기능을 실행할 수 있다(파일을 불러오거나 웹사이트 주소를 불러오기 등)

<body>

<link rel="stylesheet" href="assets/css/style.css">         // link라는 태그를 사용해서 rel 속성으로 stylesheet라는 속성값을 입력하고
</body>    " / " 기호로 head 태그의 범위 끝부분을 나타낸다        href 속성으로 외부 style.css 파일을 불러온다

                                                                  // link 태그는 body 태그 범위 안에 있다

5. 선택자 기능을 이용해서 특정 태그의 이름을 불러올수 있다, CSS 언어를 통해 시각적인 요소를 꾸미는 용도로 사용된다

- 아이디 선택자 : 한 태그에서만 고유한 특징을 적용할때 사용한다, "#" 기호를 사용한다

<html>
<p id="header"></p>  // header라는 id의 p 태그를 지정한다
  ...
</html>

  ...

<style>
# header {
    background-color:#fff;       // header라는 id에 대한 배경색을 #fff로 설정한다
}

</style>

- 클래스 선택자 : 여러 태그들에게 효과를 적용할때 사용한다 "."기호를 사용해 지정한 이름을 불러온다

<html>
<p class="header"></p>      // header라는 class 이름의 p 태그를 지정한다
  ...
</html>

<style>
.header {
    background-color:#fff;       // header라는 클래스 이름 대한 배경색을 #fff로 설정한다
}
</style>

- 전체 선택자 : 사이트 내의 모든 요소들을 선택한다, " * " 기호를 사용한다

<style>
* {
    background-color:#fff;       // 문서 내의 모든 요소들의 배경색을 #fff로 설정한다
}
</style>