css3 여러 배경 이미지의 크기 정의 > 퍼블리셔팁

퍼블리셔팁

퍼블리싱과 관련된 유용한 정보를 공유하세요.
질문은 상단의 QA에서 해주시기 바랍니다.

css3 여러 배경 이미지의 크기 정의 정보

CSS css3 여러 배경 이미지의 크기 정의

본문

여러 배경 이미지의 크기 정의

이 background-size속성은 여러 배경으로 작업 할 때 쉼표로 구분 된 목록을 사용하여 여러 배경 크기 값을 허용합니다.

다음 예제에는 세 가지 배경 이미지가 있으며 각 이미지의 배경 크기 값이 다릅니다.



#example1 {
    background: url(img_flwr.gif) left top no-repeat, url(img_flwr.gif) right bottom no-repeat, url(paper.gif) left top repeat;
    background-size: 50px, 130px, auto;
} 



<!DOCTYPE html>

<html>

<head>

<style> 

#example1 {

    background: url(img_flwr.gif) left top no-repeat, url(img_flwr.gif) right bottom no-repeat, url(paper.gif) left top repeat;

    padding: 15px;

    background-size: 50px, 130px, auto;

}

</style>

</head>

<body>


<div id="example1">

<h1>Lorem Ipsum Dolor</h1>

<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>

<p>Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>

</div>


</body>

</html>



7fcc1208aa06480d62c8746827ea7f56_1501996893_2191.png
 
추천
0
  • 복사

댓글 0개

© SIRSOFT
현재 페이지 제일 처음으로