다음 코드는 Safari에서는 작동하지 않지만 IE에서는 제대로 작동합니다.css 이미지가 사파리에 표시되지 않습니까?
<style>
.my
{
background:url("../../myproject/images/add.gif");
width:100%;
height:22px;
background-repeat: no-repeat;
}
</style>
<span class="my">
</span>
사용 backgound-image: url("../../myproject/images/add.gif"); 또는 컬러로 시작하는 background 바로 가기를 사용 background:transparent url(...) no-repeat;
그리고 display:block;을 추가하는 것은 당신이 스팬 요소의 높이와 너비를 설정할 수 있습니다,하지만 것입니다 그것은 더 이상 라인 다른 텍스트 것입니다. 좋은 답변 -
IE가 작동하고 Safari (및 Firefox)가 작동하지 않는 경우 이는 IE가 표준을 준수하지 않음을 의미합니다.
스팬은 한 가지로 너비와 높이를 가질 수 없습니다. 이전 버전의 IE는 실제로 너비와 높이를 갖게했습니다.
그래서 div를 보려는 범위를 변경할 수 있습니다.
또한 IE는 HTML 4.01 또는 XHTML 1.0과 같은 최신 Doctype을 사용하므로 IE가보다 표준 렌더링 방법을 사용하려고합니다.
LOL을 볼 사용해야합니다! –
기본적으로 span 요소는 display: inline이므로 height 및 width 속성은 적용되지 않습니다.
명시 적 치수가없고 내용이 없으므로 0으로 렌더링됩니다. 배경이 눈에 띄지 않습니다.
다른 요소 (기본적으로 블록)를 사용하거나 높이 및 너비가 적용되는 표시 속성을 적용하여이 기능을 작동 시키십시오.
즉, 콘텐츠가없는 상자를 만드는 경우 처음에는 img 요소를 사용해야 할 가능성이 아주 높습니다. 다른
일부 사람들은 이미지를 배경 요소로 넣어 주위의 텍스트로 선택되지 않도록합니다. 조금 과장 되긴하지만. – animuson
당신은 background-image: url(...);이 here
이것을 읽었습니까? '속성 값 중 하나가 누락되면 문제가되지 않습니다. 존재하는 값이이 순서대로되어 있으면 문제가되지 않습니다.' '배경'을 입력하면 '배경 이미지'를 입력하는 것보다 짧아집니다. 전혀 차이가 없다. – animuson
예, W3Schools가 다시 쓰레기가되었습니다. 그것은 두려운 자원이며, 그것은 단지 하나의 오류입니다. (배경 이미지를 사용하는 것은이 상황에서 도움이되지 않지만 ** 단축 버전 (지정되지 않은 속성을 재설정 함)과 개별 속성을 사용하는 ** 차이점이 ** 있습니다. – Quentin
@David Dorward : 오류라고 생각하지 않고 추가해야 할 정보가 누락되었습니다. – animuson
이미지에만 배경을 사용하면 상속받을 수있는 배경색이 지워집니다 ... 나는 항상 이미지 만있는 배경을 사용합니다. – animuson
@animunson 귀하의 권리, 비록 투명 한 png 또는 gif가 있다면 배경 바로 가기에 투명한 색을 정의하는 것이 약간 안전합니다. 브라우저가 표시되지 않습니다 (Safari는 배경색을 "초기"로 설정하고 FF는 정의되지 않은 경우 "투명"으로 설정 함). – Nilloc
@animunson, 나는 저주받은 webkit inspector를 사용한다. 계산 된 값은 정의되지 않았을 때 실제로 투명하다. – Nilloc