[Web] 웹페이지 구성 요소 정리

Date:     Updated:

카테고리:

태그:

웹페이지의 구성 요소

태그(Tag)

html 요소를 정의하는데 사용되는 코드. 시작태그, 종료태그가 있음

 <p></p>, <img>, <br>

속성(Attribute)

요소에 추가적인 정보를 제공하는 부분. 열린 태그에서 정의. (속성이름=속성값)

<p>hello</p> // 속성이 없음
<p class="text">hello</p> // class 속성
<p id="text">hello</p> // id 속성
 <img src=“img.png”> // src 속성

요소(Element)

태그와 속성을 합쳐 놓은 것. 내용을 갖는 요소, 내용을 갖지 않는 요소가 있음

 <p>hello</p>, <img src=“img.jpg”>, <br>

내용(Content)

시작태그와 종료태그 사이에 위치한 내용. 내용을 갖는 태그, 갖지 않는 태그가 있음.

<p>hello</p> // hello가 내용

CSS 선택자(CSS selector)

selector 종류 스타일 적용 범위 사용법
Type Selector(tag 선택자) 특정 태그를 사용한 모든 요소 태그명
Class Selector 동일한 class명을 사용하는 모든 요소 .class명
     
ID Selector 해당 id를 가진 단일 요소(ID는 페이지에서 유일해야 함) #id명
Group Selector 쉼표로 구분된 모든 선택자에 해당하는 요소 선택자1,…, 선택자n

Web Development 카테고리 내 다른 글 보러가기