CSS에서 배경 이미지 위치를 설정하는 방법-프런트엔드 Q&A-php.cn

CSS에서 배경 이미지 위치를 설정하는 방법

藏色散人

풀어 주다： 2023-01-05 16:11:07

원래의

15042명이 탐색했습니다.

CSS에서 배경 이미지의 위치를 설정하는 방법: 먼저 HTML 샘플 파일을 만든 다음 본문에 div를 만들고 마지막으로 "배경: url('/i/eg_bg_03.gif')no-repeat를 통해 설정합니다. 왼쪽 하단;}" 배경 이미지의 위치가 충분합니다.

CSS에서 배경 이미지 위치를 설정하는 방법

이 기사의 운영 환경: Windows7 시스템, HTML5&&CSS3 버전, Dell G3 컴퓨터.

CSS에서 배경 이미지 위치를 설정하는 방법은 무엇입니까?

배경 이미지를 사용할 때 배경 이미지의 위치가 원하는 것과 다른 경우가 종종 있습니다. 그렇다면 배경 이미지의 위치를 어떻게 설정해야 할까요? CSS를 사용하여 배경 이미지의 위치를 설정하는 방법을 살펴보겠습니다.

배경 이미지의 배경 이미지 위치 속성에서 background-position은 요소의 배경 이미지 위치를 제어하는 데 사용됩니다. 세 가지 값을 허용합니다:

키워드: 위쪽, 오른쪽, 아래쪽, 왼쪽, 가운데

길이 값(예: px, em, rem 등)

백분율 값: %

배경 위치 속성은 배경을 설정합니다. 이미지 시작 위치.

이 속성은 배경 이미지로 정의된 원본 배경 이미지의 위치를 설정합니다. 배경 이미지가 반복되는 경우 이 지점부터 시작됩니다.

예:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
div{width: 200px;height: 200px;
border:1px solid #ccc;
background: url(&#39;/i/eg_bg_03.gif&#39;) no-repeat left bottom;}
</style>
</head>
<body>
<div></div>
</body>
</html>

로그인 후 복사

효과는 다음과 같습니다.

CSS에서 배경 이미지 위치를 설정하는 방법