코드 썸네일형 리스트형 [HTML/CSS 기초 강의] ⑳ 이미지 정렬3(#div) 이미지 정렬3(#div)하는 방법에 대해 알아보려고 한다. 1. 태그 이미지 수직 정렬은 CSS의 vertical-align 속성 이용, 수평 정렬은 CSS의 float 속성 이용 수평 방향으로 가운데 정렬 불가능-이미지는 텍스트와 같은 inline 요소이기 때문 그러면 이미지를 가운데 정렬할 수 있는 방법은 없을까? 이미지를 가운데 정렬하기 위해서는 먼저 이미지를 블록 레벨 요소처럼 만들어야 함 정렬하려는 이미지가 있는 줄에는 다른 텍스트 없이 이미지만 있어야 한다는 뜻 이때! 사용할 수 있는 것이 태그 태그는 HTML 요소들을 블록 레벨 요소로 묶는 역할함 인라인 요소인 이미지를 태그로 감싸고, text-align 속성을 쓰면 이미지를 왼쪽/오른쪽/가운데 정렬할 수 있음 text-align .. 더보기 [HTML/CSS 기초 강의] ⑲ 이미지 정렬2(#vertical-ailgn#float) 이미지 정렬2(#vertical-ailgn#float)하는 방법을 알아보려고 한다. CSS를 이용하여 이미지 수직/수평 정렬 방법 이미지의 align은 수직과 수평을 통틀어서 하나의 속성명 'align'을 사용 CSS에서는 수직 정렬과 수평 정렬할 때 사용하는 속성명이 다름 1. 수직 정렬 속성명: vertical-align vertical-align의 속성 값- top위쪽 맞춤/middle중간 맞춤/bottom아래쪽 맞춤 vertical-align의 디폴트 값-baseline 아래쪽 맞춤과 비슷 2. 수평 정렬 속성명: float float의 의미: '떠다니다'라는 뜻-텍스트 사이에서 이미지를 왼쪽이나 오른쪽으로 보냄 속성 값은 left/right/ 가운데 정렬 없음 3. 이미지 수직 정렬 연습 메.. 더보기 이전 1 다음
