웹프로그램

CSS 이미지 테두리를 액자처럼 라인 넣어 주기

세이박스 2009. 5. 4. 16:17
반응형


이미지만 출력시 다소 허전한 느낌을 줄때 테두리에 연한 회색으로 그려 주면 다소 깔끔하게 보입니다.
스타일 적용은 다음과 같습니다.

<div style="width:이미지폭px;height:이미지높이px;border:2 solid #CDCDCD;padding:2px;">
<img src="이미지">
</div>

위처럼 Div 로 이미지 소스를 감싸 주시면 되며
width : 이미지의 폭 픽셀 값을 넣어 주시구요
height : 이미지의 높이 픽셀 값을 넣어 주세요
border : 라인 두께 인데 적절히 조절해서 이용하세요
solid #color : color 값은 이미지에 어울리는 색으로 넣어 주시면 됩니다.
padding : 이미지와 라인 사이 공백으로써 적절히 띄워주시면 깔끔하게 보입니다. 큰 이미지 일수록 많이 띄워야 겠죠..^^ 
반응형