배경 : 없음 대 배경 : 투명 차이점은 무엇입니까?

배경 : 없음 대 배경 : 투명 차이점은 무엇입니까?

---

이 두 CSS 속성 간에 차이점 이 있습니까?

background: none;
background: transparent;

1. 둘 다 유효합니까?
2. 어느 것을 사용해야하며 왜 그런가?

---

그들 사이에는 차이가 없습니다.

background약식 인 6 개 이상의 속성에 대한 값을 지정하지 않으면 기본값으로 설정됩니다. none및 transparent기본값입니다.

는 명시 적으로 background-imageto none를 설정하고 암시 적으로 background-colorto를 설정합니다 transparent. 다른 하나는 다른 방법입니다.

---

@Quentin의 답변에 대한 추가 정보 로서 backgroundCSS 속성 자체는 다음과 같은 약어입니다.

background-color
background-image
background-repeat
background-attachment
background-position

즉, 다음과 같이 모든 스타일을 하나로 묶을 수 있습니다.

background: red url(../img.jpg) 0 0 no-repeat fixed;

이것은 (이 예에서) 다음과 같습니다.

background-color: red;
background-image: url(../img.jpg);
background-repeat: no-repeat;
background-attachment: fixed;
background-position: 0 0;

그래서 ... 설정할 때 : background:none;
모든 배경 속성이 없음 으로 설정되어
있다고 말하고 있습니다 ... 선언되지 않은 상태 background-image: none;와 그 밖의 모든 것을 initial상태 로 말하고 있습니다.
따라서 background:none;:

background-color: initial;
background-image: none;
background-repeat: initial;
background-attachment: initial;
background-position: initial;

이제 색상 만 정의하면 ( transparent기본적으로) 다음과 같이 말합니다.

background-color: transparent;
background-image: initial;
background-repeat: initial;
background-attachment: initial;
background-position: initial;

@Quentin이 올바르게 말한 것처럼 이 경우 의 default transparent와 none값 은 동일하므로 반복 합니다. 예와 원래 질문의 경우 아니요, 차이는 없습니다.

그러나! .. 만약 당신이 background:noneVs 라고 말하면 background:red... 큰 차이가 있습니다. 제가 말했듯이, 첫 번째는 모든 속성을 설정 none/default하고 두 번째 속성 은 변경 color하고 나머지는 그의 default상태로 유지합니다 .

요약하면 다음과 같습니다.

짧은 대답 : 아니오, 전혀 차이가 없습니다 (예와 원래 질문에서)
긴 대답 : 예, 큰 차이가 있지만 속성에 부여 된 속성에 직접적으로 의존합니다.

---

Upd1 : 초기 값 (일명 default)

초기 값은 장기 속성의 초기 값을 연결합니다.

background-image: none
background-position: 0% 0%
background-size: auto auto
background-repeat: repeat
background-origin: padding-box
background-style: is itself a shorthand, its initial value is the concatenation of its own longhand properties
background-clip: border-box
background-color: transparent

자세한 background설명은 여기를 참조 하십시오

---

Upd2 : 더 나은 background:none;사양을 명확 하게합니다.

---

To complement the other answers: if you want to reset all background properties to their initial value (which includes background-color: transparent and background-image: none) without explicitly specifying any value such as transparent or none, you can do so by writing:

background: initial;

참고URL : https://stackoverflow.com/questions/20784292/backgroundnone-vs-backgroundtransparent-what-is-the-difference