화면 높이에 따라 테이블이나 div 안에 이미지 크기를 조정하고 싶습니다.이미지와 표의 크기를 동시에 조정하려면 어떻게해야합니까?
나는 이미지의 크기를 바꾸기 위해 모든 종류의 코드를 사용하지만, 테이블이나 div 외부로 드래그하는 대신 항상 절대 위치 지정 스테핑을 얻습니다.
- 이미지의 비율을 준수해야합니다.
- 전체 이미지는 항상 모든 화면 해상도에서 볼 수 있어야합니다. (스크롤하지 않음).
- 테이블의 맨 위 셀은 항상 크기가 조정 된 이미지의 너비와 같지만 고정 높이 여야합니다.
- 내 이미지 ("1.jpg")는 원래 800x600입니다.
내 코드 :
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Test</title>
<style>
html, body, table { height:100%; width:auto; }
.stretch {
height:100%;
width:auto;
}
</style>
</head>
<body>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="125px" bgcolor="#CCCCCC"> </td>
</tr>
<tr>
<td><img src="images/1.jpg" class="stretch" /></td>
</tr>
</table>
</body>
단지 HTML ? – Phphelp