① 소스 내용
<?xml version="1.0" encoding="EUC-KR" ?>
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR" />
<title>CSS 1</title>
<style type="text/css">
/* CSS에서 유일한 주석
selector(선택자) {
선언부
}
*/
div {
/* border : 3가지 (선스타일, 선굵기, 선색깔) 순서없이*/
border: thin solid black;
padding : 100px; /* px : pixel 픽셀 */
/* margin : 위 오른쪽 아래쪽 왼쪽 */
margin : 100px 50px 150px 50px;
/*
transparent : 위의 margin과 아래의 margin이 겹칠 수 있다.
*/
}
body{
/*
body태그안에 div가 있으므로 div가 body의 속성을 상속받을 수 있다.
border, padding, margin은 상속되지 않는다.
*/
font-family: '궁서', dotum;
/* color : yellow; 색이름 지정 */
color : #666666; /* RGB 컬러 지정 두개의 숫자가 같을경우 ex) #FF0011 = #F01*/
}
p {
/*
border는 상속되지 않는 속성이므로 강제로 div의 속성을 상속받도록 해야한다
padding, margin, width, height도 마찬가지
*/
border : inherit;
}
</style>
</head>
<body>
<div>
<p>p태그</p>
몽골용단의 말춤 기대됨
</div>
<div>
저녁은 뭘 먹지???
</div>
</body>
② 실행화면
p태그
몽골용단의 말춤 기대됨'WEB > CSS' 카테고리의 다른 글
WEB 2일차 여섯번째) div로 레이아웃 잡기 (0) | 2012.09.13 |
---|---|
WEB 2일차 다섯번째) div (0) | 2012.09.13 |
WEB 2일차 네번째) CSS 두번째 (0) | 2012.09.13 |