HTML_구조이해2

ESTHER PARK·2023년 5월 12일
0

HTML

목록 보기
2/11

이번에는 태그이야기를 조금더 자세히 해보려한다.

지난 포스트에서 <오늘의 태그>로 올려두었던 것 중 어떤것은 <></>이고 또 어떤것은 <>만 있었다.

이것은 태그의 종류 중 태그를 닫아야만 마무리한것으로 보는게 있냐하면, 싱글태그로 끝지 필요하지 않은 경우도 있다.

예를들어, 다음과 같다.

싱글태그 : <img src="cake.png" alt="이미지에 대한 설명글">
일반태그 : <html>내용 ~ 내용</html>

<태그 특성>
이것말고도 태그의 특징은 다양한데,

1. 태그는 대소문자 모두 사용가능하지만, 주로 소문자로한다
2. 확장자는 .html으로 지정한다. 
3. 태그는 영역에 따라 2가지 종류가 있다.
	- block 태그 : 라인 전체를 자신의 영역으로 삼는 태그 (width, height 존재) >> 구조를 나타내는 앨리먼트
    - inline 태그 : 콘텐츠 영역만 자신의 라인으로 삼는 태그 >> 앨리먼트 내에 존재
4. 태그는 구조에따라 2가지 종류가 있다.
	- 싱글태그 : 시작태그만 존재 > 콘텐츠 없음
    - 일반태그 : 시작과 끝태그가 존재 > 콘텐츠 있을수 있음
4. 속성을 가질 수 있다. 

특히 여기서 속성은 태그뿐 아니라 js과의 연동에도 큰 역할을 한다.

1. 속성값은 태그의 시작에 들어간다.
2. 속성명 = 속성값 형태로 사용한다. 
3. 속성 종류
	3-1. 필수속성 : 반드시 있어야하는 속성
    	- <img src="속성의 경로값" alt="속성오류 시 출력문"'>
	3-2. 선택속성 : 반드시 없어도 됨
    	- <title class="title">두 번째 문서</title>

또한 키워드등으로 사용되는 특수문자를 일반 문자로 출력하기 위해 파이썬의 이스케이프 문자와 같은 툴이 존재하는데, 이를 "charactor entity name" 이라한다.


<오늘의 태그>
** 태그 내 "'" 표시는 인식오류로 임의 삽입한것입니다!

  1. <'img srt="경로" alt="파일에러 시 출력메세지"> : 에디터에 업로드(또는 db에 연동된) 이미지 파일의 경로를 통해 이미지를 삽입하는 기능
    - single tag
    - 필수속성(srt, alt)
    2.네이버로 이동 : 해당 url로 이동하는 태그
    - single tag
    - 필수속성(href)

0개의 댓글