쓸만한 주저리

css를 이용해서 개체를 유동적으로 고정시킬 때

봄돌73 2007. 3. 14. 15:00
스타일을 이용해서 개체를 고정시키는 법은 쉽다.

<img src=... style=position:absolute;left:100;height:100>

위와 같이 쓰면 왼쪽에서 점 100개, 위에서 점 100개 위치에 그림이 고정되게 된다.
그러나 가끔 왼쪽 위치는 고정되어 있지만 위에서부터 위치는 가변적인 경우나 그 반대의 경우가 생긴다.

이럴 때는

<img src=... style=position:absolute;left:100>
<img src=... style=position:absolute;height:100>

위와 같이 어느 한쪽을 생략하게 되면 그 부분의 위치는 가변적으로 나오게 된다.

<td><img src=... style=position:absolute;left:100;height:100></td>

위와 같은 경우는 <td>에 영향을 받지 않고 고정된 위치(100,100)에 나오지만

<td><img src=... style=position:absolute;height:100></td>

위와 같은 경우는 위에서부터 위치는 점 100개 위치로 고정되지만 좌측 위치는 <td>에 영향을 받게 된다.
반대의 경우도 마찬가지다.