소개
소스
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Display속성의 block/inline/none</title>
<style type="text/css">
div, p { border: 1px solid red; }
span { background-color:Yellow; }
#inlineToBlock { display:block; }
#blockToInline { display:inline; }
#hideBlock { display:none; }
</style>
</head>
<body>
<!-- 블록 요소 -->
<div>
첫번째 블록 영역
</div>
<p id="hideBlock">
두번째 블록 영역
</p>
<!-- 인라인 요소 -->
<div>
안녕하세요. <span id="inlineToBlock">반갑습니다.</span>
<img src="images/about.gif" alt="이미지" />
<p id="blockToInline">또 만나요.</p>
</div>
</body>
</html>
실행 결과
