카테고리: HTML 기본 요소

HTML 기본 요소

HTML 테이블(Table) 태그와 속성

테이블(Table)테이블(Table)이란 여러 종류의 데이터(data)를 보기 좋게 정리하여 보여주는 표를 의미한다. HTML에서는 < table> 태그로 이러한 테이블을 표현한다. <table> 태그는 다음과 같은 태그들로 구성된다. <tr> 태그는 테이블에서 열을 구분해 준다. <th> 태그는 각 열의 제목을 나타내며, 모든 내용은 자동으로 굵은 글씨에 가운데 정렬이 된다. <td> 태그는 테이블의 열을 각각의 셀(cell)로 나누어 준다. 이번 장에서는 HTML 테이블 […]

HTML 목록(List) 태그 종류

목록(List)목록(List)이란 여러 요소들을 일렬로 나열된 글, 명단을 의미한다. 목록 = 리스트 같은 말로 사용 된다. HTML에서는 이러한 목록을 표현하기 위해 다음과 같은 리스트를 제공한다. 순서가 없는 목록(unordered list) 순서가 있는 목록(ordered list) 정의 목록(definition list) 순서가 없는 HTML 목록(Unordered HTML List) HTML에서 순서가 없는 목록은 <ul> 태그로 시작하며, 여기에 포함되는 각각의 목록 요소는 <li> 태그로 […]

HTML 이미지(Image) 태그 종류

이미지(Image)이미지(image)란 2차원 평면 위에 그려진 시각적 요소를 의미한다. 웹 페이지에는 이러한 이미지가 매우 중요한 요소의 하나다. 웹 페이지의 디자인과 모양을 크게 향상시킬수 있다. HTML <img> 태그 HTML에서 이미지를 삽입할때에 <img> 태그를 사용한다. <img> 태그는 종료 태그가 없는 빈 태그(empty tag)이며, src 속성을 사용하여 이미지 URL(주소)를 지정한다. 예제 alt 속성은 사용자가 볼 수 없는 이미지를 설명한 […]

HTML 링크(Link) 연결 태그 사용방법

링크(Link)링크는 거의 모든 웹 페이지에서 사용하고 있을만큼 사용용도가 높다. 링크를 통해 사용자는 페이지에서 페이지로 이동할 수 있도록 설정가능하다. HTML 하이퍼 링크(Hyperlink) HTML 링크는 하이퍼링크(HyperLink)라고 부른다. 현재 웹 페이지에서 다른 웹 페이지나 사이트로 연결하도록 하는 기능을 가지고 있다. 이러한 하이퍼 링크를 간단히 링크(link)라고 말하며, HTML에서는 <a> 태그를 사용한다. ※링크는 꼭 텍스트일 필요는 없다. 텍스트, 이미지 등 […]

HTML 백그라운드 이미지(Background Image) 변경 방법

백그라운드 이미지(Background Image)배경색이라고 하며, HTML 문서의 배경색을 뜻한다. 기본색은 흰색이다. HTML 요소들 또한 각자의 배경색을 가지고 있으며, 배경색을 다른 색으로 변경하거나 다른 이미지로 변경하는게 일반적이다. HTML 배경색을 다른 색으로 변경 HTML5 이전까지는 bgcolor 속성을 이용하여 HTML 요소의 배경색을 다른 색으로 변경할 수 있었다. 하지만 HTML5부터는 bgcolor 속성을 더 이상 지원하지 않으며, CSS를 이용하여 배경색을 변경하게 […]

HTML 색상(Color) 표현 방식

색상(Color)빨강, 파랑, 녹색이라는 이름 등으로 서로 구별되는 특성을 말한다. 이러한 3가지 색이 모여 다양한 색상을 만들수 있다. HTML에서 색을 표현하는 방법에는 총 6가지가 존재한다. 색상 이름으로 표현 RGB 색상으로 표현 HEX(16진수) 색상으로 표현 HSL 색상으로 표현 RGBA 색상으로 표현 HSLA 색상으로 표현 색상 이름(Color Names) HTML에서는 색상 이름을 사용하여 색상을 지정할 수 있다. W3C에서 정의한 […]

HTML 스타일(Style) 속성 지정 방식

스타일(Style)스타일은 어떠한 것을 표현하기 위한 방식이다. 예를들어 글자색, 배경색을 바꾼다던지, 글짜크기를 바꾸는 방식 같은것이다. HTML 스타일은 아래와 같은 것을 뜻한다. 기본 예제 HTML 스타일(Style) 속성 HTML 요소의 style 속성(attribute)을 이용하면 CSS 스타일을 HTML 요소에 직접 설정할 수 있다. 하지만 이러한 style 속성을 이용한 방법은 오직 단 하나의 HTML 요소에만 스타일을 적용할 수 있도록 되어 있다. […]