CSS에서이 라인은 무엇을 의미합니까?CSS에서이 라인은 무엇을 의미합니까?
#ffffff url(https://cloud.githubusercontent.com/assets/1830348/15354890/1442159a-1cf0-11e6-92b1-b861dadf1750.jpg) no-repeat center center/cover
나는 그것을 알아 내려고하고있다. W3S에서는 구조에 대해 다음과 같이 말하고 있지만 '/'및 다른 속성이이 구조와 어떻게 일치 하는지를 볼 수 없습니다.
background: bg-color bg-image position/bg-size bg-repeat bg-origin bg-clip bg-attachment initial|inherit;
이 줄은
background: #ffffff url(...) no-repeat center center/cover;
사실에 대한 축약 버전입니다. - documentation 따르면
당신이 그것을 분할 글쎄, 당신은 순서대로 다음과 같은 읽기 있다고 볼 수 있습니다 :
background-color | background-image | background-repeat | background-position | background-size
속기 작품 없습니다와 아니오 '/ cover'이 유효하지 않습니다. 배경 크기입니다. – Harry
그것은 흰색 배경이 이미지로 덮여 의미한다 https://cloud.githubusercontent.com/assets/1830348/15354890/1442159a-1cf0-11e6-92b1-b861dadf1750.jpg 인 경우 중앙 정렬되며 너비 또는 높이 중 가장 큰 값에 맞게 늘려 비율을 유지합니다.
background-color: #ffffff;
background-image: url(...);
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
/이 유효 CSS가의 formal syntax on MDN를 참조하십시오
"또는"가 아닌 - 커버는 너비 ** 및 ** 높이 모두에 맞게 늘어나고 추가로 작물을 만듭니다. – Hogan
cover 스케일링 이미지에 특수 값이다
커버 값은 모두 크기가 보장하면서 작게 가능한 있도록 배경 이미지 크기가되도록 지정 보다 크거나 컨테이너의 해당 크기와 같습니다.
여기에 자신의 sample fiddle
FireFox에만 적용 가능합니까? – Lee
아니요, 그렇지 않습니다. MDN에서 [background-size] (https://developer.mozilla.org/en/docs/Web/CSS/background-size)를 참조하십시오. – andreas