background 태그

H·2023년 8월 6일

1.배경색

html 요소의 배경색을 성정하기 위해 css속성 'background-color'를 활용합니다. 미리 정의된 색상 이름, 16진수 색상 코드, RGBB 값 및 HSL (색조, 채도, 밝기) 값을 포함하여 다양한 색상 중에서 선택할 수 있습니다

1)기본색상

140개의 미리 정의된 색상 이름 세트를 제공합니다. 인기 있는 예로는 "빨간색", "파란색", "녹색", "노락색" 및 "검은색"이 있습니다.이러한 이름은 기본 색상을 빠르게 선택할 수 있는 편리한 방법을 제공합니다.

<body style="background-color: red;">

2)16진수 색상 코드

16진수 색상 코드는 파운드 기호(#) 다음에 문자(A-F)와 숫자(0-9)의 6자리 조합으로 표시됩니다. 각 숫자 쌍은 각각 색상의 빨강, 녹색 및 파란(RGB)의 강도를 나타냅니다. 이 방법은 선택할 수 있는 다양한 색상을 제공합니다

<body style="background-color: #FFA500;">

3)RGB값
RGB 값을 사용하면 빨강, 녹색 및 파랑 색상의 강도를 0~255 범위에서 개별적으로 정의할 수 있습니다. 이 방법을 사용하면 색상 선택을 정밀하게 제어할 수 있습니다.

2.background-position

배경에 위치를 설정하는 태그

  • background-position-x 속성은 배경 이미지의 x축 위치를 설정
  • background-position-y 속성은 배경 이미지의 y축 위치를 설정
background-position-x: -600px;

3.관련된 속성

-background-image 속성은 배경 이미지 경로 및 그라디언트를 설정합니다
-background-position 속성은 배경 이미지의 위치를 설정합니다
-background-size 속성은 배경 이미지 사이즈를 설정합니다
-background-repeat 속성은 배경 이미지 반복 여부를 설정합니다
-background-origin 속성은 배경 이미지의 위치 기준점을 설정합니다
-background-clip 속성은 배경 이미지의 위치 기준점을 설정합니다
-background-attachment 속성은 배경 이미지의 고정 여부를 설정합니다
-background-color 속성은 배경 색을 설정합니다
-background-blend-mode 속성은 배경 이미지를 혼합했을 때의 상태를 설정합니다

0개의 댓글