Web/HTML 10

[HTML] 공간 분할 태그

웹 문서에서 공간을 분할하는 방법은 와 태그를 이용하면 된다. 와 태그공간을 분할하기 위해 사용하는 태그로 공간을 전체적으로 분할하여 사용할 것인지, 일부 영역만 분할하여 사용할 것인지에 따라 다르게 사용된다. 간단하게 말하면 블록 형식과 인라인 형식으로 나뉜다고 생각하면 된다.  태그웹 브라우저 전체 공간에 대해 분할한다. 이를 '블록 형식'이라고 한다.  태그웹 브라우저의 일부 영역만 분할한다. 이를 '인라인 형식'이라고 한다. 인라인 형식 (Inline)특징: 요소가 한 줄 내에서 다른 요소들과 함께 나란히 배치된다.사용 용도: 주로 텍스트 내에서 작은 단위의 요소에 적용됩니다. 예를 들어, 굵은 글씨, 기울임 글씨, 하이퍼링크 같은 것들이 인라인 형식이다.크기: 인라인 요소는 자신이 포함된 텍..

Web/HTML 2024.09.14

[HTML] 폼 태그

웹 양식은 사용자가 웹 문서에 어떤 데이터를 입력하고 그 결괏값을 가져오기 위해 사용한다. 이와 같은 웹 양식은 웹 문서와 사용자 사이에서 원하는 정보를 주고받을 수 있도록 인터페이스를 제공한다. 폼 태그는 이러한 웹 양식을 만드는 데 사용하는 태그이다.  태그폼을 만드는 기본 태그이다.   태그의 속성  태그사용자가 입력하는 부분을 대부분 처리하는 태그이다. 입력하는 내용의 종류는 type 속성을 통해 지정한다. type 속성의 유형text한 줄 짜리 텍스트 입력 필드이다. 주로 아이디나 이름, 주소 등을 입력할 때 사용한다. 입력 폼의 기본 글자 수는 20자인데 size 속성으로 기본 글자 수를 변경할 수 있다. 또한 value 속성을 이용하면 기본으로 입력되어 있는 값을 지정할 수 있다. 물론 다른..

Web/HTML 2024.09.14

[HTML] 멀티미디어 태그

HTML5는 멀티미디어 데이터를 웹 문서에 포함하여 사용할 수 있는 임베디드 콘텐츠 태그를 정의하였다. 다음 표는 임베디드 콘텐츠 태그를 정리한 것이다.태그설명이미지 파일 삽입그래픽 그리기오디오 파일 삽입동영상 파일 삽입 미디어 요소 트랙 삽입미디어 소스 삽입개체 삽입 멀티미디어 파일을 웹 문서에 삽입할 때는 반드시 웹 문서와 같은 폴더에 있어야 한다. 만약 같은 폴더에 있지 않다면 파일이 저장된 경로, 즉 절대 경로를 모두 입력해야 한다. 이미지HTML5에서 사용하는 대표적인 이미지 파일 종류로는 GIF, JPG, PNG 등이 있다. 이미지 파일들은 각각 장단점이 있기 때문에 용도에 맞게 사용해야 한다.  태그웹 문서에 이미지를 삽입할 때 사용한다.  태그의 속성src : 이미지 파일이 저장된 경로를 ..

Web/HTML 2024.09.14

[HTML] 표

HTML5 문서에 표를 만들 때는 태그를 사용한다. 표는 행과 열로 이루어지며 각각의 칸인 셀(cell)로 구성되는데, 표를 만들 때는 행을 먼저 만들고 원하는 만큼 열을 나눈다. 표를 만들 때 사용하는 태그 ~ : 표 전체 ~ : 행 ~ : 셀 ~ : 제목 셀 이름 점수 유비 90 관우 80 장비 70  출력 결과  태그의 border 속성값을 0으로 하거나 사용하지 않으면 경계선 없이 표시할 수 있다.  태그표에 제목을 삽입할 때는 태그를 사용한다. 삼국지 멤버들의 농구 점수 내기 출력 결과 c..

Web/HTML 2024.09.14

[HTML] 목록

HTML5에서는 목록형 문단의 글머리를 표현할 수 있는 방법으로 무순서 목록, 순서 목록, 정의형 목록을 제공한다. 무순서 목록 태그를 사용하며 각 항목은 태그로 입력한다. ul은 unordered lists의 약자이고 li는 list item의 약자이다. 목록의 각 항목 앞에는 불릿이 붙는데, 불릿의 기본 모양은 검은색 작은 동그라미이다. 순서 목록1 순서 목록2 출력 결과 순서 목록 태그를 사용하며 각 항목은 태그로 입력한다. ol은 ordered lists의 약자이다. 목록의 각 항목에는 기본값으로 type="1"이 적용되어 숫자 1부터 매겨진다. 다음 표는 태그가 가질 수 있는 속성이다.type불릿 앞의 숫자 조정예) a를 사용하면 알파벳으로 순서가 출력된다.start중간 번호부터..

Web/HTML 2024.09.14

[HTML] 하이퍼링크

하이퍼링크란 다른 사이트 혹은 같은 문서 내 다른 위치로 이동하는 것을 말한다. 'anchor'의 약자인 태그를 사용하여 정의한다. 태그는 기본적으로 href 속성을 가지며 이 속성값에 URL을 입력해 원하는 곳으로 이동한다. URL에 표기할 수 있는 값으로 다음의 다섯 가지 유형이 있다.표기 유형표기 예절대경로 URL 표시href="https://www.google.co.kr"상대경로 URL 표시href="hello.html" 태그에 기본 URL 지정페이지 내 요소 위치 표기href="#top"프로토콜 URL 표기https://, ftp://, mailto:, file: 등스크립트 표기href="javascript:alert("hello");" 웹 사이트 이동하이퍼링크가 가장 많이 사용되는 경우는 ..

Web/HTML 2024.09.14

[HTML] 특수문자 처리 방법

HTML5 문서는 일반적인 워드 문서와 다르게 특수문자나 키보드 입력값을 그대로 출력할 수 없다. 특히 , & 같은 문자는 예약어로 사용하고 있어 문자가 아닌 태그로 인식하기 때문에 직접 입력할 경우 웹 브라우저는 오류로 인식한다. 특수문자나 키보드 입력값을 웹 브라우저에 출력하려면 특수이름 혹은 아스키코드 값을 사용하여 소스코드를 작성해야 한다. 다음 표는 특수문자와 키보드 입력값에 해당하는 특수이름과 아스키코드값을 나타낸 것이다.특수문자/키보드특수이름아스키코드<<>>>###&&&스페이스바(spacebar)$nbsp;  그런데 특수이름과 아스키코드는 일일이 기억하기 어렵기 때문에 보통 태그를 사용한다. 태그는 공백, 특수문자, 줄 바꿈 ..

Web/HTML 2024.09.14

[HTML] 텍스트 관련 태그

HTML 문서에서 가장 많이 사용하는 자료 유형은 당연히 텍스트이다. 이 글에서는 자주 사용하는 텍스트 관련 태그를 정리했다. 태그각 웹 콘텐츠 영역에서 제목을 표시할 때 사용하는 태그기본형 : 제목크기 : h1 > h2 > h3 > h4 > h5 > h6  태그줄 바꿈. 줄을 바꿀 위치에 사용하는 태그기본형 :   태그수평 줄을 생성해 주는 태그기본형 :   태그텍스트 단락이 만들어지는 태그. 자동으로 줄 바꿈이 됨기본형 : 텍스트  태그내용의 앞 뒤에 따옴표(" ")가 추가되는 태그. 인용문에 적합기본형 : 텍스트  태그안으로 들여 써지는 태그. 인용문에 사용하기 적합기본형 : 인용 내용 , 태그굵게 표시해 주는 태그. 전자는 검색 시에 중요한 내용으로 포함됨기본형: 텍스트, 텍스트 , 태그이탤릭..

Web/HTML 2024.09.14

[HTML] 태그

태그HTML에서 태그란 요소라고도 부르며, HTML 문서를 구성하는 기본 단위이다. HTML5 문서의 구조HTML5 문서는 과 ,  HTML5 문서를 선언하는 구문으로, 이 문서가 HTML5로 작성된 웹 문서임을 웹 브라우저에 알려주는 역할을 한다. 이 구문은 생략할 수 있지만 하위 호환성을 위해 작성할 것은 권장한다.  ~ HTML5 문서의 시작과 종료를 알린다. 태그는 문서의 최상위(root) 요소이기도 하며, 언어(lang) 속성을 사용하여 주된 언어 값을 설정할 수 있다. 웹 페이지의 정보를 정의하는 곳으로, 다음과 같은 태그를 사용할 수 있다. 태그 태그에 작성한 내용이 웹 브라우저의 제목 표시줄에 나타난다. -->Page Title 태그문서를 만든 이, 검색시 키워드, 웹 페이지 정보,..

Web/HTML 2024.09.14

[HTML] 웹

인터넷인터넷은 우리가 사용하는 컴퓨터를 전 세계 규모로 연결한 것이다. 웹인터넷 환경에서 웹 문서의 특징 정보를 사용할 수 있도록 해주는 서비스를 월드 와이드 웹(World Wide Web) 또는 줄여서 웹이라고 한다. 웹은 인터넷 표준 문서 시스템이다. 웹의 특징웹 서비스의 목적은 많은 사람들이 정보를 보다 쉽게 공유하고 접근할 수 있도록 하는 것이다. 특징은 다음과 같다.전 세계의 컴퓨터를 연결한다.HTTP 프로토콜을 사용한다.HTML로 작성된 문서를 연결한다.웹은 기본적으로 클라이언트-서버 모델을 기반으로 동작한다. 즉 여러 사용자들이 다양한 웹 페이지를 만들어 웹 서버에 저장해 놓으면, 인터넷에 연결되어 있는 수많은 클라이언트가 서비스를 요청하여 서버에 저장되어 있는 정보를 제공받는다. 웹 표준의..

Web/HTML 2024.09.14