HTML 테이블(Table) 테이블(Table)이란 여러 종류의 데이터(data)를 보기 좋게 정리하여 보여주는 표를 의미한다. HTML에서는 태그를 사용하여 이러한 테이블을 작성할 수 있다. 태그는 다음과 같은 태그들로 구성한다. 태그는 테이블에서 열을 구분해 준다. 태그는각 열의 제목을 나타내며, 모든 내용은 자동으로 굵은 글씨에 가운데 정렬이 된다. 태그는 테이블의 열을 각각의 셀(cell)로 나누어준다. 커피 스무디 차 사이다 콜라 환타 초코우유 딸기우유 바나나우유 CSS의 border 속성을 이용하여 테이블에 테두리를 표현할 수 있다. border 속성값을 따로 명시하지 않으면, 해당 테이블은 언제나 빈 테두리를 가지게 된다. 테이블의 테두리(border)가 두 줄씩 나타나는 이유는 태그와 태그..

HTML 리스트(List) 리스트(list)란 여러 요소들을 일렬로 나열한 목록이나 명단을 의미한다. HTML에서는 이러한 리스트를 표현하기 위해 다음과 같은 리스트를 제공한다. 순서가 없는 리스트(unordered list) 순서가 있는 리스트(ordered list) 정의 리스트(definition list) 순서가 없는 리스트 순서가 없는 리스트는 태그로 시작하며, 여기에 포함되는 각각의 리스트 요소는 태그로 시작한다. 각각의 리스트 요소 앞에는 기본 마커(marker)로 검정색의 작은 원(bullet)이 위치한다. 순서가 없는 리스트 검정색 노랑색 흰색 CSS의 list-style-type 속성을 사용하면 리스트 요소 앞에 위치하는 마커(marker)를 다른 모양으로 변경할 수 있다. disc :..

링크(Link) 웹 페이지에는 다른 페이지나 다른 사이트로 연결되는 수많은 하이퍼 링크(hyperlink)가 존재한다. 이러한 하이퍼 링크를 간단히 링크(link)라고도 부르며, HTML에서는 태그로 표현한다. HTML 링크 태그의 href 속성은 링크를 클릭하면 연결할 페이지나 사이트의 URL 주소를 명시한다. 태그는 텍스트나 단락, 이미지 등 다양한 HTML 요소에 사용할 수 있다. target 속성 태그의 target 속성은 링크로 연결된 문서를 어디에서 열지를 명시한다. target 속성값 설명 _blank 링크로 연결된 문서를 새 창이나 새 탭에서 오픈. _self 링크로 연결된 문서를 현재 프레임(frame)에서 오픈. (기본설정) _parent 링크로 연결된 문서를 부모 프레임(frame)에..

HTML 배경(Background) HTML 문서의 기본 배경(background)은 흰색이다. 또한, HTML 요소들도 각자 자신만의 배경을 가지고 있다. HTML에서는 이러한 배경을 다음과 같이 변경할 수 있다. 배경을 다른 색으로 변경 배경을 다른 이미지로 변경 배경색을 다른 색으로 변경 HTML5 이전까지는 bgcolor 속성을 이용하여 HTML 요소의 배경색을 다른 색으로 변경할 수 있었다. 하지만 HTML5부터는 bgcolor 속성을 더 이상 지원하지 않으며, CSS를 이용하여 배경색을 변경하도록 하고 있다. CSS의 background 속성을 이용하면, 더욱 다양한 방법으로 배경색을 설정할 수 있다. 배경을 다른 이미지로 변경 background 속성을 이용하면 HTML 요소의 배경을 이미지..

HTML에서 색을 표현하는 방법은 다음과 같이 세 가지 방법이 있다. 색상 이름으로 표현 RGB 색상값으로 표현 16진수 색상값으로 표현 색상 이름으로 표현 W3C에서 정의한 16개의 HTML4 표준 색상 이름은 다음과 같다. HTML에서 색상 이름은 대소문자를 구분하지 않는다. 색상 이름으로 표현된 파란색 색상 이름으로 표현된 녹색 색상 이름으로 표현된 은색 색상 이름으로 표현된 청록색 색상 이름으로 표현된 빨간색 주요 브라우저가 140개의 색상 이름을 모두 지원하고 있다. RGB 색상값으로 표현 모니터나 스크린은 빨간색(Red), 녹색(Green), 파란색(Blue)을 혼합하여 색을 표현한다. HTML에서도 위와 같이 세 가지 색을 가지고 색을 표현하는 RGB 색상을 사용한다. RGB 색상의 기본색(..

HTML 스타일(Style) HTML 요소의 style 속성(attribute)을 이용하면 CSS 스타일을 HTML 요소에 직접 설정할 수 있다. 하지만 이러한 style 속성을 이용한 방법은 오직 단 하나의 HTML 요소에만 스타일을 적용할 수 있다. 배경색 변경 다음 예제는 style 속성을 이용하여 배경색을 변경하는 예제다. style 속성을 이용한 배경색 변경 글자색 변경 다음 예제는 style 속성을 이용하여 글자색을 변경하는 예제다. style 속성을 이용한 글자색 변경 글자 크기 변경 다음 예제는 style 속성을 이용하여 글자 크기를 변경하는 예제다. style 속성을 이용한 글자 크기 변경 문단 정렬 변경 다음 예제는 style 속성을 이용하여 문단 정렬을 변경하는 예제다. style 속..