클래스란 무언가를 계속 만들어 낼 수 있는 설계도면이고,객체는 클래스로 만든 피조물
클래스와 객체의관계는 과자틀과 과자틀에 의해 만들어진 과자와 같음.
이 때 클래스가 과자틀이고,객체가 과자.
class 클래스이름:<!-- css 공부-->
<html>
<head>
<title>css 공부</title>
</head>
<body>
<div>
<div style="color: red; font-size: 2em;">제목1</div>
<span style="color: black; font-size: 1em;">내용1</span>
</div>
<div>
<div style="color: red; font-size: 2em;">제목2</div>
<span style="color: black; font-size: 1em;">내용2</span>
</div>
<div>
<div style="color: red; font-size: 2em;">제목3</div>
<span style="color: black; font-size: 1em;">내용3</span>
</div>
</body>
</html>css를 사용하면 웹문서의 서식을 일괄적으로 지정이 가능하다.
style은 css를 정의하는 코드
스타일은 class라고도 부른다.
class를 정의하는방법: style태그안에.(마침표)라고 쓴 후, 희망하는 class의 이름을 입력.
그리고 중괄호를 열고 해당 class에 적용될 style을 기록.
여러가지 class를 정의해둔 후, 원하는 태그에 원하는 class를 얼마든지 지정.
<!-- css 공부-->
<html>
<head>
<title>css 공부</title>
<style>
.title {
color: red;
font-size: 2em;
}
.content {
color: black;
font-size: 1em;
}
</style>
</head>
<body>
<div>
<div class="title">제목1</div>
<span class="content">내용1</span>
</div>
<div>
<div class="title">제목2</div>
<span class="content">내용2</span>
</div>
<div>
<div class="title">제목3</div>
<span class="content">내용3</span>
</div>
</body>
</html>
천방지축😛 얼레벌레🙄 빙글빙글🙃 돌아가는 수지의 코드~🎵