style : css 에서 기존의 태그의 선택자 설정, 또는 아이디, 클리스 등의 정의 및 설정용 지정 태그
※특정 태그의 선택자 설정 및 재정의
태그 명 {
-내부 설정-
}
※다양한 선택자
선택자는 일반, 계층, 그룹 선택자가 존재 한다.
-일반 선택자
전체 선택자 : 직접적으로 사용을 명시하지 않아도 자동으로 설정이 적용되는 선택자
* {
내부 설정
}
※실습 스크립트
<style>
* {
background-color: blue;
}
</style>
. . .
<body>
<div></div>
</body>
</html>
->전체 화면이 파란색으로 변함
태그 선택자 : 태그 사용 시 자동으로 적용되는 선택자
태그 명{
내부 설정
}
※실습 스크립트
<style>
p{
background-color: aqua;
}
</style>
. . .
<body>
<div>
<p>안녕하세요</p>
</div>
</body>
->p 태그 적용 부분에 배경색 적용됨
클래스 선택자 : 해당 선택자의 사용을 명시할 때 중복 사용이 가능한 선택자
.클래스 명{
내부 설정
}
※실습 스크립트
<style>
.bgcolor{
background-color: purple;
}
</style>
. . .
<body>
<div>
<p class="bgcolor">안녕하세요</p>
<p>안녕히가세요</p>
</div>
</body>
->class 옵션이 적용된 태그에만 배경색이 적용됨
->재사용이 가능함
아이디(id) 선택자 : 중복 사용이 불가한 선택자
#아이디(id) 명{
내부 설정
}
※실습 스크립트
<style>
#setbg{
background-color: tomato;
}
</style>
. . .
<body>
<div>
<p id="setbg">안녕하세요</p>
<p>안녕히가세요</p>
</div>
</body>
->id 가 적용된 태크에만 배경 적용됨
->id 는 중복사용이 불가
댓글
댓글 쓰기