Div 와 Span 태그
Posted at 2010/03/16 11:52// Posted in 홈페이지만들기/HTML* 테이블은 셀과 셀의 공간을 묶어 놓은 집합체이면 Div 와 Span 은 그 각각이 하나의 공간으로 이루워집니다. 테이블에서는 셀의 크기를 먼저 계산한 후 보여지고 Div 와 Span 는 바로 보여지기때문에 렌더링이 뛰어납니다. 특별한 속성은 없으며, style 속성에 사용되어지는 요소로서 형태와 기능이 달라집니다.
Div 태그
- Division
- 시작과 종료 태그의 들어가는 내용에 따라 공간의 크기가 달라집니다.
- 자동 줄바꿈 기능을 가지고 있습니다.
- Division
- 시작과 종료 태그의 들어가는 내용에 따라 공간의 크기가 달라집니다.
- 자동 줄바꿈 기능을 가지고 있습니다.
Span 태그
- 시작과 종료 태그의 들어가는 내용에 따라 공간의 크기가 달라집니다.
- 자동 줄바꿈 기능을 가지고 있지 않습니다.
- 시작과 종료 태그의 들어가는 내용에 따라 공간의 크기가 달라집니다.
- 자동 줄바꿈 기능을 가지고 있지 않습니다.
* width, height - 크기 (단위를 사용하지 않으면 자동으로 px로 인식합니다.)
<div style="width:100px;height:300px;">내용</div>
<span style="width:100px;height:300px;">내용</span>
* background - 배경
* border - 테두리
* padding - 내용과 경계의 여백
* margin - 박스와 윈도우 사이의 여백을 결정하여 박스의 위치를 정함. 요소로 상 ,하, 좌, 우(음수가능)
* overflow - 내용이 길 경우 스크롤바 생성
* font - 내용에 들아가는 글자의 스타일 결정
* color - 글자 색
<div style="color:#ffooff">내용</div>
<span style="color:red">내용 </span>
<div style="width:100px;height:300px;">내용</div>
<span style="width:100px;height:300px;">내용</span>
* background - 배경
* border - 테두리
* padding - 내용과 경계의 여백
* margin - 박스와 윈도우 사이의 여백을 결정하여 박스의 위치를 정함. 요소로 상 ,하, 좌, 우(음수가능)
* overflow - 내용이 길 경우 스크롤바 생성
* font - 내용에 들아가는 글자의 스타일 결정
* color - 글자 색
<div style="color:#ffooff">내용</div>
<span style="color:red">내용 </span>
'홈페이지만들기 > HTML' 카테고리의 다른 글
| 에디트 플러스 (0) | 2010/08/05 |
|---|---|
| 북부 HTML반 (0) | 2010/07/30 |
| Div 와 Span 태그 (1) | 2010/03/16 |
| 목록 태그 속성 (0) | 2010/03/16 |
| 메타태그 / meta tag (0) | 2010/03/11 |
| noresize 프레임의 크기를 잠금 (0) | 2010/03/11 |
-
이기철2010/03/16 15:36 [Edit/Del] [Reply]축하합니다 출간을
