2010-06-14 4 views
2

테두리 너비를 정의 할 수 있습니까? 같은테두리 두께 (두께가 아님) 정의

.box{ 
    width:200px; 
    height:100px; 
    border-bottom:1px solid #000; 
} 

상자 폭은 200px입니다하지만 난 바닥에만 100px의 테두리 너비를 원한다.

alt text http://www.freeimagehosting.net/uploads/6ba3c54859.png

+0

당신이하려는 일에 대한 스케치를 올릴 수 있습니까? – SWeko

+2

은 테두리가 아니며 요소와 독립적 인 선입니다. 심지어


을 사용할 수 있습니다. –

답변

1

테두리가 절반 인 것처럼 들립니다. 이상하지만, 행할 수 있다고 생각합니다. Firefox, Chrome 및 Safari에서 작동합니다. MSIE 나는 현재 손에 있지 않아 문제를 일으킬 수 있습니다.

이 방식의 작동 방식은 배경색이 절반 인 배경색과 1 픽셀이 div.box보다 큰 상자를 사용하는 것입니다. 몸에 회색 배경을 넣어서 작동하는 것을 볼 수 있습니다.

<html> 
<style type="text/css"> 
body { 
    background-color: #ccc; 
    color: #000; 
} 
.box-border { 
    width: 100px; /* half as wide as .box! */ 
    height: 101px; /* just slightly taller than .box! */ 
    background-color: #000; 
    overflow: visible; /* .box, inside this, can go outside it */ 
} 
.box{ 
    width: 200px; 
    height: 100px; 
    background-color: #fff; 
} 
</style> 
<body> 
    <div class="box-border"> 
     <div class="box"> 
      The quick brown fox jumped over the lazy dog. 
     </div> 
    </div> 
</body> 
</html> 
2

번호 당신은 폭 100 픽셀 인 .box 내에서 다른 요소를 넣어 가지고 있고, 그에 테두리를 적용 할 수 있습니다.

0

은 또는 당신이 그런 배경 이미지를 정의 .box { 배경 : 홈페이지 (border.gif) 노 - 반복 0 하단;}

이미지는 100 픽셀 폭에 대한 예를 들어 2 픽셀의 어이입니다.

관련 문제