CSS 이미지 관련

이미지 관련

■ CSS img 속성 

  ο width

    이미지의 가로 크기를 지정한다. 크기 단위는 in(인치), cm(센치미터), mm(밀리미터), pt(포인터), pc(피카스), em, ex(em대비 1/2크기), px(픽셀), %(%단위)등의 상대적 단위크기를 사용하기도 한다.

  ο height

    이미지의 세로 크기를 지정한다. 단위는 width와 같다.

  ο vertical-align

    이미지가 텍스트와 함께 사용되는 경우 텍스트의 위치를 지정하는 속성이다. top(위쪽), middle(가운데), bottom(아래쪽) 값을 사용할 수 있다.

  - 참고

    css를 이용해서 image resize(css 3)를 하려면, img tag안의 height, width를 모두 없애야 한다.

    <style type="text/css">

      div img {

   resize:both;  /*이미지 최대 사이즈에 적용*/

   float:center;

   max-width:200px;

        height:auto;

   margin: 5px 0;

     } 

    </style>

<div><img src="sosi.jpg"/></div>