이미지가운데정렬 썸네일형 리스트형 [HTML/CSS 기초 강의] ⑳ 이미지 정렬3(#div) 이미지 정렬3(#div)하는 방법에 대해 알아보려고 한다. 1. 태그 이미지 수직 정렬은 CSS의 vertical-align 속성 이용, 수평 정렬은 CSS의 float 속성 이용 수평 방향으로 가운데 정렬 불가능-이미지는 텍스트와 같은 inline 요소이기 때문 그러면 이미지를 가운데 정렬할 수 있는 방법은 없을까? 이미지를 가운데 정렬하기 위해서는 먼저 이미지를 블록 레벨 요소처럼 만들어야 함 정렬하려는 이미지가 있는 줄에는 다른 텍스트 없이 이미지만 있어야 한다는 뜻 이때! 사용할 수 있는 것이 태그 태그는 HTML 요소들을 블록 레벨 요소로 묶는 역할함 인라인 요소인 이미지를 태그로 감싸고, text-align 속성을 쓰면 이미지를 왼쪽/오른쪽/가운데 정렬할 수 있음 text-align .. 더보기 [HTML/CSS 기초 강의] ㉑ 이미지 가운데 정렬 방법들 이미지 가운데 정렬 방법을 알아보려고 한다. 이미지 가운데 정렬 방법 1. 태그 사용 태그 앞뒤에 , 태그 사용 후 text-align 속성값을 center로 주면 div 안의 인라인 요소 이미지가 가운데 정렬됨 태그 안에 div 선택자도 가능 2. display, margin 사용 display 속성을 사용하여 속성값을 block으로 정하면 이미지를 블록 레벨 요소로 바꿀 수 있음 그 후에 margin을 auto로 주면 이미지가 가운데 정렬 margin:요소를 감싸고 있는 여백 /auto 값: 좌우 여백을 똑같이 주는 것으로 정해져 있음 3. 태그 사용 태그는 블록레벨 요소로, 그 안의 인라인 요소를 가운데 정렬하는 기능 있음 HTML5에서는 지원하지 않는 태그-사용하지 않는 것이 좋음 , 태그는 블록.. 더보기 이전 1 다음
