>  기사  >  웹 프론트엔드  >  CSS 구문 매뉴얼 (5) 색상 및 배경 속성

CSS 구문 매뉴얼 (5) 색상 및 배경 속성

黄舟
黄舟원래의
2016-12-19 16:16:501367검색

1. 색상

기능: 전경이나 요소의 색상을 설정합니다.
숫자: 색상 키워드 또는 RGB 값을 사용하세요.
예:


텍스트 색상(키워드)

텍스트 색상(#rrggbb)

텍스트 색상 [rgb(rr , gg,bb)]

텍스트 색상 [rgb(r%,g%,b%)]

2. background-color

기능: 페이지 또는 페이지 설정 요소의 배경색입니다.
값:
색상 - 사용 가능한 색상 이름 또는 RGB 값
투명 - 투명, 페이지 배경을 기본 배경으로 설정합니다.
예:


배경색

3. 배경 이미지

기능: 배경 그래픽을 정의합니다.
값:
없음 - 그래픽을 배경으로 사용하지 않음
url - 그래픽 파일의 URL 주소 제공
참고: 그래픽을 사용할 수 없을 때 사용할 수 있도록 background-color 속성을 포함할 수도 있습니다.
예:


그래픽 배경

4. background-repeat

기능: 그래픽 배경 반복 여부를 제어합니다. .
값:
repeat - 수직 및 수평 반복, 기본값
repeat-x - 수평 반복
repeat-y - 수직 반복
no-repeat - 반복 없음
설명: 이 속성은 background-image 및 background-position 속성과 함께 사용됩니다.
예:


가로 반복 배열

5. background-attachment

기능: 요소의 배경을 지정합니다. 요소와 함께 스크롤하거나 페이지의 특정 위치에 고정됩니다.
값:
scroll - 요소와 함께 스크롤
고정 - 고정
설명:
기본값은 스크롤이며 이 속성은 배경 이미지 속성과 함께 사용됩니다.

6. background-position

기능: 요소 배경을 공간에 배치하는 데 사용됩니다.
값:
길이 - 요소 상자 가장자리의 시작점을 상대적으로 설정합니다. 또는 절대 단위를 사용하고 단위 아래에 좌표를 제공합니다.
백분율 - 브라우저가 이미지 배치를 시작하는 상자 가장자리의 위치를 ​​백분율로 나타냅니다. 이 값을 반복하여 수직 및 수평 시작점을 제공할 수도 있습니다.
수직 위치 - 시작점을 수직 방향으로 설정합니다. 키워드는 top, center, Bottom입니다.
수평 위치 - 수평 방향의 시작점을 설정합니다. , 키워드 left, center, right
예: top left, left top 및 0% 0%는 모두 그래픽의 왼쪽 상단이 요소 상자의 왼쪽 상단에서 시작한다는 의미입니다
예:


Body {Background- image:url(logo.gif); background-position:50% 50%}

이 명령문은 Body 기본 클래스를 다음으로 설정합니다. 페이지 중앙에 표시될 배경 그래픽입니다.

7. 배경

기능: 약어 속성, 모든 배경 속성을 설정할 수 있습니다.
값:
배경 첨부
배경 색상
배경 이미지
배경 위치
배경 반복
위 값에 대한 자세한 내용은 개별 속성 섹션을 참조하세요.

위 내용은 CSS 문법 매뉴얼 (5) 색상 및 배경 속성 내용입니다. 더 많은 관련 내용은 PHP 중국어 홈페이지(www.php.cn)를 참고해주세요!


성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.