개발/Front-end (3) 썸네일형 리스트형 [HTML] 글자크기, 글자색,글씨체 (<font> 태그와 <span> 태그) 안녕하세요. 오늘은 기본적이지만 가끔 헷갈릴 때가 있는 태그와 태그를 비교하면서 글씨와 관련된 것들을 알아보려고 합니다. 간단하지만 자주 쓰지 않으면 저는 헷갈리더라고요. 그래서 정리해봤습니다. ▷ 글자크기 설정 태그 font 태그의 글자크기 설정방법 태그 span 태그의 글자크기 설정방법1 span 태그의 글자크기 설정방법2 ▷ 글자색깔 설정 태그 font 태그의 글자색깔 설정방법 태그 span 태그의 글자색깔 설정방법 ▷ 글씨체 설정 태그 font 태그의 글씨체 설정방법 태그 span 태그의 글씨체 설정방법 [CSS] display:table 위의 이미지 속처럼 메뉴목록을 만들 때 테이블처럼 같은 크기로 나오는 메뉴를 만들 때 사용할 수 있다. displat:table 속성은 다른 요소를 마치 table 태그 속성처럼 바꿔주는 속성이다. float이라는 속성을 써서 right 혹은 left로 컨텐츠를 띄워준다. float은 원래 이미지를 띄워서 텍스트랑 배치할 때 사용하는 속성이지만 요즘은 레이아웃에 많이 쓰인다. 실은 나도 레이아웃에서만 써봤다. float 속성과 함께 width나 height를 같이 써서 배치해준다. 위의 이미지처럼 만들 때는 width를 100% / 갯수 해주면 된다. 예를 들어 이미지 속의 큰메뉴는 총 5개이므로 width는 100%/5 = 20%가 된다. 간단한 예시는 아래와 같다. .menu_tab { overflo.. [HTML] alt 속성 줄바꿈 alt 속성은 img 태그에서 이미지에 대해 설명해주는 내용이다. 150자 이내로 사용 가능하다. 이러한 속성은 브라우저에서 보이지는 않지만 이미지를 보지 못하는 시각장애인과 같은 사람들이 스크린리더를 통해 듣거나 검색엔진이 이미지를 읽을 때 이미지 자체가 아닌 alt속성을 읽게 된다. 위의 이미지의 경우 이미지 속에 텍스트가 있지만 그 내용은 alt 속성에서 설명해준다. alt 속성에서 줄 바꿈 하는 방법은 아래와 같이 원하는 위치에 
을 추가해주면 된다. 이전 1 다음
