CSS의 배경 (배경)

CSS 배경 속성은 HTML 요소의 배경을 정의하는 데 사용됩니다.

CSS 속성은 배경 효과를 정의

• 배경 색상
• 배경 이미지
• 배경 반복
• 배경 - 첨부 파일
• 배경 위치

배경 색상

배경 컬러 속성은 요소의 배경색을 정의한다.

페이지 배경색 본체 선택기 사용 :

CSS는 색상 값은 일반적으로 다음과 같이 정의된다 :

• 육각 - 예 : "# FF0000의"
• RGB - 예 : "RGB (255,0,0)"
• 색상 이름 - 예 : "빨간색"

다음의 예, H1, P, 및 DIV 요소는 서로 다른 배경색을 가지고

배경 이미지

배경 이미지 속성은 배경 이미지 요소를 설명한다.

기본적으로 배경 화상을 반복하여 전체 소자 엔티티를 덮도록 바둑판 표시된다.

페이지의 배경 이미지 설정 예 :

여기서 텍스트와 배경 이미지의 잘못된 조합의 일례이다. 가난한 가독성을 텍스트 :

배경 이미지 - 가로 또는 세로 바둑판 식 배열

기본적으로 배경 이미지 속성은 페이지의 수평 또는 수직 방향으로 바둑판 식으로 배열된다.

일부 이미지는 가로와 세로 바둑판 식으로 배열, 그래서 다음과 같이이 매우 조화 보이는 경우 :

수평 방향으로 만 화상 타일 (반복-X)을 페이지 배경 좋을 경우 :

배경 이미지 - 설정 위치가 아닌 타일

배경 이미지는 텍스트 레이아웃에 영향을주지 않는하자

이 이미지 타일을하지 않으려면, 당신은 배경 반복 속성을 사용할 수 있습니다 :

위의 예에서, 배경 이미지 및 텍스트가 동일한 위치에 표시하는 페이지 레이아웃이 합리적하게하기 위해, 텍스트의 판독에 영향을주지 않고, 우리는 이미지의 위치를 ​​변경할 수있다.

배경 포지션 속성은 여기에 배경 이미지를 변경하는데 사용될 수있다 :

배경 - 약식 속성

위의 예에서, 우리는 제어 많은 속성을 통해 페이지의 배경색을 볼 수있다.

이러한 속성에 대한 코드를 단순화하기 위해, 우리는 이러한 특성이 동일한 속성에 결합되어 사용할 수 있습니다.

은 "배경"에 대한 약식 속성 배경 색상 :

속기 속성을 사용하는 경우, 특성 값의 순서 등 ::

• 배경 색상
• 배경 이미지
• 배경 반복
• 배경 - 첨부 파일
• 배경 위치

이러한 모든 속성은 해당 페이지의 실제 필요에 따라 사용할 수 있으며, 사용할 필요가 없습니다.

이 예는 인스턴스를 볼 수 있습니다, CSS는 이전에 기술 사용 CSS 예를

더 많은 예제

고정 된 배경 이미지를 설정하는 방법
이 예는 고정 된 배경 이미지를 설정하는 방법을 보여줍니다. 이미지는 페이지의 나머지 부분과 스크롤되지 않습니다.

CSS 배경 속성