본문 바로가기
조회 수 2103 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

+ - Up Down Comment Print
?

단축키

Prev이전 문서

Next다음 문서

+ - Up Down Comment Print

div 태그와 span 태그의 차이는

div 태그는 한줄전체를 영역으로 하고 span태그는 태그안의 내용 만큼만을 영역으로 합니다.

예를들어

<div style="color:white;background:gray;">이 영역을 보시기 바랍니다</div>

<span style="background:blue;color:white;">첫번째 영역</span>

<span style="background:red;color:white;">두번째 영역</span>

<span style="background:green;color:white;">세번째 영역</span>

 

다음의 예를 보세요

<div style="color:white;background:gray;border:1 solid black;">이 영역을 보시기 바랍니다</iv>

<div style="color:white;background:gray;border:1 solid black;">이 영역을 보시기 바랍니다</iv>

<span style="background:blue;color:white;">첫번째 영역</span>

<span style="background:red;color:white;">두번째 영역</span>

<span style="background:green;color:white;">세번째 영역</span>

div 태그는 한줄을 차지하므로 위에서 처럼 두줄에 걸쳐 표시되고

span 태그는 영역 만큼만 출력되고 옆으로 이동하여 표시됩니다.


Title
List of Articles
번호 제목 글쓴이 날짜 조회 수
11 Refresh HTML Page in Browser Automatically Hojung 2014.06.07 1337
» div태그와 span태그 비교 Hojung 2013.12.07 2103
9 What is the difference between <section> and <div>? Hojung 2013.12.07 1583
8 CSS 선택자의 종류 Hojung 2012.03.15 2753
7 CSS 적용방법 Hojung 2012.03.15 2084
6 CSS 강좌5 - CSS 레이아웃 생성 file Hojung 2012.03.15 3714
5 CSS 강좌4 - 주요 요소 설정 file Hojung 2012.03.13 2108
4 CSS 강좌3 - 갠버스 설정 file Hojung 2012.03.13 2061
3 CSS 강좌2 - 기본 html 작성 Hojung 2012.03.13 1978
2 CSS 강좌1 - 레이아웃 잡기 file Hojung 2012.03.13 8212
1 추천 CSS 강좌 (Good) Hojung 2012.03.13 2174
Board Pagination ‹ Prev 1 Next ›
/ 1

Designed by sketchbooks.co.kr / sketchbook5 board skin

나눔글꼴 설치 안내


이 PC에는 나눔글꼴이 설치되어 있지 않습니다.

이 사이트를 나눔글꼴로 보기 위해서는
나눔글꼴을 설치해야 합니다.

설치 취소

Sketchbook5, 스케치북5

Sketchbook5, 스케치북5

Sketchbook5, 스케치북5

Sketchbook5, 스케치북5