* EDITCSS 테두리가 올바르게 표시되지 않습니다.
저는 총을 약간 튀게되었습니다.
새로운 질문 :
당신이 국경에서 액자 효과를 제거 할 수 있습니까?
을하지만 파이어 폭스와 크롬에서 다음과 같이 표시
border-left: 5px solid #009933;
그것은 사파리에서 잘 표시
그래서 내가 사업부에서이 CSS 코드가 있습니다 :
그래서 내 질문에, Firefox와 Chrome이 다르게 표시되는 이유는 무엇이며 어떻게 Safari에서 표시하는 것처럼 보이게 할 수 있습니까?
감사합니다.
테두리 모서리의 정확한 렌더링은 브라우저마다 다릅니다.
두꺼운 테두리가있는 경우 브라우저는 테두리 사이에 대각선 경계를 만들려고합니다. 오른쪽 모서리에있는 픽셀은 국경 중 하나에서 색상을 얻을 수 있습니다 :
******************
+*****************
++****************
+++***************
++++
++++
++++
또는 다른 국경 :
+*****************
++****************
+++***************
++++**************
++++
++++
++++
다른 브라우저는 그 두 가지 방법 중 하나를 사용하지만, 다른 모든 사 요소의 모서리. 한때 다른 브라우저가 사용하는 것을 비교해 보았습니다. 각 브라우저 공급 업체가 다른 브라우저에서는 사용하지 못했던 방식을 선택하는 것처럼 보였습니다.
Firefox와 Chrome은 왼쪽 하단의 경계에 수평 경계선 색상을 사용합니다.
는 다른 내부에 하나 개의 요소를 사용하고 내부 요소에 외부 요소에 수직 테두리와 수평 경계를 설정합니다 :++++******************
++++******************
++++******************
++++******************
++++
++++
++++
++++
, 측면 테두리가 외부에 갈 즉를 얻으려면.
예 (과장 국경 폭은 효과를 보여와 함께) :
.outer { border: 10px #0c0; border-style: none solid; }
.inner { border: 10px #ccc; border-style: solid none; }<div class="outer"><div class="inner">Demo</div></div>
당신이 여기 바이올린을 만들 수 있습니다 -> http://jsfiddle.net/ –
당신이이 수행을 "재설정"CSS 시트? 기본적으로 각 브라우저의 스타일을 "삭제"하는 데 도움이 될 수 있습니다. 어쩌면 그것이 이유 일 것입니다. 당신이 그것을 가지고 있지 않다면 (나는 권장하지 않는다) 최소한 margin : 0; 및 패딩 : 0; 귀하의 신체에 –
그것은 매우 관련된 정보의 더 많은 정보 (마크 업 및 CSS)없이 대답하기 어려울 것입니다.FF와 Chrome에서는 오른쪽 요소 사이에 수평선이 있고 "D"는 다른 배경색을가집니다. –