CSS 강좌 / 타입 선택자(Type Selector)
오늘은 홈페이지의 글자의 타입을 지정해 주는 타입 선택자에 관하여 학습합니다.
타입 선택자(Type Selector)는 h1, p, div, span 등 HTML 요소(Element)를 선택하는 선택자입니다.
예를 들어
p {
color: blue;
}
는 HTML 문서 안에 있는 모든 p 요소의 내용을 파란색으로 만듭니다.
예제
h1 요소의 글자색은 파랗게, blockquote 요소의 글자를 기울임꼴로 만드는 예제입니다.
<!doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<title>CSS</title>
<style>
h1 {
color: blue;
}
blockquote {
font-style: italic;
}
</style>
</head>
<body>
<h1>평화의 왕이시여!</h1>
<p>죄와 두려움이 창궐한 세상에서 저희를 평화의 길로 인도하시는 목자시여!
불변하는 본성 불변하는 사랑의 하나님이여!
</p>
<h1>
Proin 주의 무한하신 가슴으로 이 작은 인생들을 품어주시고 금년 한 해의 인생을 은혜로 인도하심을
믿고 즐거워하며 영광 돌리게 하옵소서.
오늘 예배에 성령의 기름 부음이 있어 마리아가 주님께 부은 향기름과 같이 향기로운 예배
되게 하시어 저희들의 예배를 흠향하시며 기도를 열납하여 주시옵소서.
</h1>
<p>
미약함에도 불구하고 저희는 예수그리스도 안에서 은통을 받은 사람들이라
이 은총을 감사한다면 진정 겸손한 감사와 신앙을 품고 저희에게 주어진 삶의 시간들을 경외와
순종으로 감당하게 하소서.
</p>
<blockquote>
존귀하신 하나님!
말씀의 사자이신 담임목사님과 올 한 해도 함께 하셔서 성령으로 충만하게 하옵시며
말씀의 권위에 세우시며 영적인 은혜를 더하셔주소서.
육신의 건강, 가정의 행복, 사역의 승리를 주시옵소서.
이 시간도 그의 사역에 큰 열매 주시옵소서.
</blockquote>
</body>
</html>
위 코드 실행한 결과는
'홈페이지제작 > CSS' 카테고리의 다른 글
[CSS 기초강좌 ] 아이디 선택자(ID Selector) (0) | 2018.01.09 |
---|---|
[CSS 기초강좌] 선택자 > 클래스 선택자(Class Selector) (0) | 2018.01.08 |
[CSS강좌] 전체 선택자(Universal Selector) (0) | 2018.01.04 |
[기초CSS 강좌 ] 반응형 레이아웃 만들기(홈페이지만들기) (0) | 2018.01.02 |
[CSS3기초] 홈페이지 레이아웃 만들기 [웹사이트의 레이아웃](2) (0) | 2018.01.01 |