devil cat everdevel character

프로그래머가 아니던 시절 만들기 시작한 에버디벨 !
첫 오픈 한달과 최근 한달의 방문자수를 비교해보니 무려 190배 이상 증가했습니다.
그 사이 어느새 1년 9개월의 경력을 갖고 있는 프로그래머가 되었습니다.
실무의 경험을 담아 더 많은 내용으로 올해 언젠가 에버디벨이 책으로 나옵니다.
{HTML5, CSS3, jQuery, MySQL5, PHP7(PDO, OOP, MVC)}
아무것도 몰라도 컴퓨터만 있다면 하나부터 학습하며 발전해 나가는 자신을 보는 감동을 드리겠습니다.

disney Teyon kin

CSS를 적용하는 방법

1강에서는 CSS를 HTML문서에 적용하는 방법부터 알아보겠습니다.

3가지 방법이 있는데요.

외부문서로 저장하여 연결하기 (Linked Style)

					<link rel="stylesheet" type="text/css" href="스타일시트 경로" />
				

CSS파일을 따로 관리 할 수 있어서 소스에 섞임이 없어서 가장많이 쓰이는 방식이며 다른 소스에 적용시켜도 그대로 적용이 되므로 하나의 CSS로 여러 패이지를 적용시키는 방법입니다.

위의 소스를 아래 head태그안에 넣어야 합니다.

아래와 같이

				<!DOCTYPE html>
				<html>
				<head>
				<title></title>
				<link rel="stylesheet" type="text/css" href="스타일시트 경로" />
				</head>
				<body>
				<div>
				</div>
				</body>
				</html>

				

문서 내부에 정의하기 (Embedded Style)

문서 내부에 정의 하는 방법은 위와 같이 외부 문서로 지정하지 않고 CSS를 헤드 태그 안에 스타일 태그를 선언하여서 그 안에 적용하는 방법 입니다.

				<!DOCTYPE html>
				<html>
				<head>
				<title></title>
				<style type="text/css">
					div{background:#fff}
				</style>
				</head>
				<body>
				<div>
				</div>
				</body>
				</html>
					

태그에 직접 지정하기 (Inline Style)

태그에 직접 지정하는 것은 아래처럼 태그 안에 style="요소"를 지정하는 방식입니다. 그럴 경우 오직 저 태그만 해당 스타일이 적용 되게 됩니다.

				<!DOCTYPE html>
				<html>
				<head>
				<title></title>
				</head>
				<body>
					<div style="background:#fff">
				</div>
				</body>
				</html>
				
다음강좌는 2강.CSS 셀렉터 입니다. 클릭하면 다음 강좌로 이동합니다.