float 예제 (79페이지)

doublemetal 2013. 7. 31. 18:30
 <!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
<style type="text/css">
p {
	border: 1px solid red;
	background: yellow;
}

img {
	border: 1px solid blue;
	padding: 10px;
}

.imgBox img {
	float: left;
}

.textBox {
	clear: both; /* float 해제 */
}
</style>
</head>
<body>
	<p class="imgBox">
		이미지를 왼쪽으로 플로트시키면 부모 요소인 P요소는 텍스트만을 자식 요소로 가지게 됩니다. <img
			src="http://img.naver.net/static/www/u/2010/0611/nmms_215646753.gif"
			width="150" height="150" />
	</p>
	<p class="textBox">걷자ㅣ거ㅏㅈ디ㅓ가ㅣㄷ저ㅏㅣ거ㅏㄷ지ㅏㅣ거ㅏㅈ디ㅏㅓ가ㅣㄷ자거잗ㄱㄷㅈ ㄱㄷㅈㄱ
		ㅈㄷㄱㅈㄷㄱㅈㄷㄱㅈㄷㄱㅈㄷㄱㄷㅈ겆디ㅏㅓ가ㅣㅈ다ㅣ가ㅣㅈ더ㅣ가ㅣㅈ디ㅓ가ㅣㅈㄷㄱ</p>
</body>
</html>