목차
- <style> 예제 - CSS 내부스타일
- <style> 정의
- <style> 구문
- <style> 속성
<style> 예제 - CSS 내부스타일
<style>
h2{color:red; text-align:center; width:300px;}
p {color:blue; text-align:center; width:300px;}
</style>
<h2>홈짱닷컴 (homzzang.com)</h2>
<p>HTML CSS PHP 무료 강의</p>
<style> 정의
① 인라인스타일
태그 명령어 내부에 사용 (예) <p style="color:red>빨강</p>
② 내부스타일
태그 명령어 외부이지만
태그 명령어와 같은 웹페이지의 상단이나 하단에 적용.
위 기본 예제 참고
③ 외부스타일 별도의 파일에 스타일을 정의 후,
<link> 태그를 이용해 태그 명령어 있는 웹페이지로 가져와 적용.
2.
<style> 태그엔 반드시 type속성에 “text/css” 속성값 지정.
(예) <style type= “text/css”>
단,
HTML5에선 type 속성 자체를 안 적어도 됨.
3.
HTML5에서 scoped 속성 추가됨.
단, 이 속성은 현재 파이어폭스만 지원.
<style> 구문
<style>
selector{property1:value1; property2:value2; ....}
</style>
<style> 속성
속성 |
속성값 |
쓰임새
|
비고 |
type |
text/css
|
스타일시트 MIME (=파일유형) 정의
※ MIME (마임) : "파일 유형"으로 이해.
(Multipurpose Internet Mail Extensions) 더 자세히 보기
|
|
media |
다양한 속성값을 취함. (예: screen)
별도로 다룰 예정
|
미디어 관련 다양한 속성을 정의 |
|
scoped |
scoped |
부모 요소와 그 자식 요소에만 스타일 적용
※ 문서 내 다른 요소엔 스타일 적용 안됨.
|
HTML5 추가
현재, 파이어폭스만 지원.
|
<style> 태그는 전역속성과 이벤트속성 지원.