티스토리 뷰
html 문서 설정 (배경색 설정하기 / 배경을 이미지로 설정하기 / 문서 기본글자색 설정하기)
(๑>ᴗ<๑) 2018. 1. 5. 13:02
html 문서 설정하기
1. 문서의 배경색 설정하기
html 문서를 작성할때 문서의 배경색을 지정해 줄 수 있다.
<body> 태그에서 bgcolor 속성을 사용하면 된다.
색상을 설정하기 위해서는 red, blue, yellow등의 색상 이름을 사용하거나
#FFFFFF. #5CD1E5, #8C8C8C와 같은 RGB 색상값을 사용하면 된다.
색상값은 네이버에서 'html 색상표' 라고 검색하면 네이버에서 제공하는 색상표가 나온다.
원하는 색을 클릭하면 색상값이 나타나는데 그 값을 복사해서 문서에 사용하면 된다.
RGB란? |
RGB(적.녹.청)에 의해 색을 정의하는 색 표시 방식이다. 빛의 3원색인 적.녹.청을 혼합하여 색을 나타내는 것이다. 예를들어 R(빨간색)+B(파란색)을 섞으면 붉은 보라색(마젠타)이 된다. RGB를 모두 섞으면 흰색이 되고, 아무 색도 비추지 않으면 검은색으로 표현되는 것이다. |
그럼 문서의 배경색을 지정하는 방법을 알아보자.
<body bgcolor="배경색"> 내용 </body> -> 이렇게 작성하여 문서의 배경색을 바꿀 수 있다.
★예시 - 배경색을 pink로 설정하였다.★
태그 ↓ ↓ ↓ ↓ ↓ ↓
<HTML> <HEAD> <TITLE>문서 배경색 설정</TITLE> </HEAD> <BODY BGCOLOR="pink"> 핑크색으로 배경색을 설정해 봅시다!! </BODY> </HTML> |
2. 문서의 배경 그림 설정하기
<body>태그에서 background 속성을 사용하면 내가 원하는 이미지를 배경으로 설정할 수 있다.
배경으로 설정된 그림은 가로, 세로로 반복적으로 표현된다.
<body background="이미지 주소"> 내용 </body> -> 이렇게 작성하여 문서의 배경을 이미지로 지정할 수 있다.
★예시 - '패턴-5.gif' 파일을 배경 그림으로 설정하였고, html문서와 이미지 파일이 같은 폴더에 있어야 한다.★
아래 문서에 배경으로 사용한 이미지 원본이다.
해당 이미지가 문서 전체에 반복적으로 나타나면서 배경으로 되었다.
태그 ↓ ↓ ↓ ↓ ↓ ↓
<HTML> <HEAD> <TITLE>배경 그림 설정</TITLE> </HEAD> <BODY BACKGROUND="패턴-5.gif"> 배경을 원하는 이미지로~!!! </BODY> </HTML> |
3. 문서의 기본 글자색 설정하기
<body> 태그에서 text 속성을 이용하여 문서 전체의 글자색을 설정할 수 있다.
<BODY BGCOLOR="배경색" TEXT="글자색"> -> 이렇게 작성하여 문서의 배경색과 글자색을 지정할 수 있다.
★예시 - 배경은 노란색으로, 글자는 초록색으로 설정하였다.★
태그 ↓ ↓ ↓ ↓ ↓ ↓
<HTML> <HEAD> <TITLE>문서전체 글자색 설정</TITLE> </HEAD> <BODY BGCOLOR="yellow" TEXT="green"> 배경색은 노란색, 글자색은 초록색으로 설정해보아요 </BODY> </HTML> |
'기억하고 싶은 정보 > HTML 공부하기' 카테고리의 다른 글
| html 글자 모양 (제목 표시하기, font 태그, 글자 속성, 특수문자) (0) | 2018.07.02 |
|---|---|
| html 문서 모양 줄바꾸기, 문단바꾸기, 수평선 그리기 (0) | 2018.01.15 |
| HTML 이란? / HTML의 구성요소 / HTML의 기본구조 (0) | 2018.01.03 |