HTML:태그

틀:HTML HTML에 대한 문서들 모음집

1. HTML:태그
2. HTML:head
3. HTML:리스트 만들기
4. HTML:태그 속성
   1. HTML:링크
   2. HTML:앵커
5. 컨텐츠 삽입
   1. HTML:이미지
   2. HTML:음악
6. HTML:요소 꾸미기
   1. HTML:헤더, 네비게이터
   2. HTML:알림버튼 만들기

개요

마크업 언어. 문서의 형태, 체계에 대해 지정하는 언어이다.

요소

크게 Inline과 Block으로 나뉜다.

속성	Inline	Block
배치	가로배치. 옆으로 쌓인다.	세로배치. 밑으로 쌓인다.
형태	형태 적용 불가. 창 크기의 영향을 받는다.	특정 크기의 상자를 만들 수 있다. 창 크기의 영향을 받지 않는다.(특별한 지정값이 없으면 창 크기에 맞춘다.)
예시	span	div

종류

종류	설명
div	블록으로 쌓이는 태그.(너비를 모두 차지하며 아래로 쌓인다.)
span	inline으로 쌓이는 태그.(옆으로 쌓인다.)
a	하이퍼링크를 달 때 쓰는 태그. 기본적으로 파란색 글씨에 밑줄이 그어지는데, text-decoration속성을 none으로 주면 일반 텍스트같아진다. href 속성에 파일 주소를 기입하면 클릭했을 때 바로 다운로드를 진행한다. 주소 대신 #를 지정하면, 현재위치를 의미한다.(보통, 구현이 안되었을 때 오류를 피하기 위해 사용)
label	다른 태그와 이어준다. for 속성에 태그의 id를 지정하면 이 태그를 클릭할 때 for에 해당하는 id를 가진 태그를 클릭한 것과 같은 효과를 낸다.

기본적으로 쌓이는 속성은 class와 style 지정으로 바꾸어 쓰기도 한다.

<style>
    span{
        width:200px;
        background-color: red;
    }
</style>

위와 같이 해당 태그를 사용했을 때의 스타일을 전체적으로 지정할 수도 있다.

태그 안에 들어갈 수 있는 속성

종류	설명
class
id
onclick	해당 태그를 클릭했을 때 어떤 일이 벌어지게 할지 지정할 수 있다. onclick="alert('로그인합시다~')"