HTML (5) 썸네일형 리스트형 국비 수업 22일 차(22.11.02.) - 책갈피, iframe, 파비콘, 디스플레이 속성 ※ 책갈피(bookmark) - 태그의 href 속성에 특정 태그의 id 속성값을 넣어서 책갈피 기능을 구현할 수 있다. 목적지로 이동! 가 나 다 라 마 바 사 아 자 차 카 타 파 하 목적지 ※ 아이프레임(iframe) - inline frame의 약자이다. iframe을 이용하면 웹 페이지 안에 또 다른 웹 페이지를 삽입할 수 있다. 하지만 현재에는 잘 쓰이지 않는다. ※ 파비콘(favicon) - favorite icon의 줄임말이다. 웹 브라우저 주소창 옆에 작은 아이콘으로 표기한다. 16 * 16 픽셀이 기본 규격이다. 안에 아래와 같이 적용한다. ※ HTML의 디스플레이 속성 1) inline 태그 - content 크기만큼 자리를 차지하는 요소이다. 문자(텍스트)의 특징을 가지고 있으며 ,.. 국비 수업 22일 차(22.11.02.) - 폼(form) ※ 폼(form) - 웹 페이지에서 사용자로부터 입력을 받을 때 사용하는 태그이다. 직접적인 입력을 담당하는 것이 아니라 입력받은 데이커를 하나의 세트로 서버에 보낼 때 사용한다. 태그를 사용하고 속성으로는 action과 method가 있다. form 속성 - action: 서버로 데이터를 전송할 때 그 데이터를 전송하는 "목적지"를 의미한다. - method: 데이터의 전송 방법을 설정하는 역할을 한다. - get: URL에 데이터를 저장하여 전송하는 방식이다. method는 생략하면 get 방식이다. 데이터들이 URL에 드러나기 때문에 보안에 취약하다는 단점이 있다. - post: (request) body에 데이터를 저장하여 전송하는 방식이다. 입력1 입력2 .. 입력 상자(input) 그룹 - 폼.. 국비 수업 21일 차(22.11.01.) - 테이블 ※ 테이블(table) - 여러 종류의 데이터를 보기 좋게 정리하여 보여주는 표로써 행과 열로 이루어져 있다. ← 테이블의 각 행 - table row 내용1 ← 테이블의 각 셀(열) - table data 내용2 ... ... - 테이블의 속성 1) border: 테이블의 테두리 두께를 설정(기본 - 0) 2) width: 테이블 전체의 가로폭을 설정 3) align: 테이블의 정렬을 설정(left, right, center) - , , 의 속성 1) width: 셀의 가로폭을 설정(td/th에 주면 같은 열에 전부 적용된다.) 2) height: 셀의 세로 높이를 설정(td/th에 주면 같은 행에 전부 적용된다.) 3) align: 셀의 텍스트 정렬을 설정(td/th에 주어도 해당 셀에만 적용된다.).. 국비 수업 21일 차(22.11.01.) - HTML5 문서, 이미지 ※ HTML5의 문서 구조 html 문서의 선언 부분이다. HTML 버전 5를 나타낸다. 생략해도 문제없이 작동하지만 HTML 버전 3로 작동한다. lang 속성은 웹 접근성에 관한 명시이다. 스크린 리더기에서 언어를 인식하여 자동으로 음성을 변환하거나, 해당 언어에 적합한 발음을 제공한다. 한국어 설정은 lang="ko"이다. 태그 - 태그에 정보를 추가하기 위한 태그이다. meta 태그를 직접 바꾸는 일은 거의 없을 것이다. charset 속성은 문자를 인코딩 할 때 문자 코드를 설정하는 역할을 담당한다. 우리나라 윈도우 기본 문자셋인 EUC-KR을 사용해도 되지만, 다국어로 인코딩 하기 위해서는 UTF-8 문자셋을 사용하기를 권장한다. http-equiv, name "Author", "Keyword.. 국비 수업 20일 차(22.10.31.) - HTML 태그 ※ HTML(HyperText Markup Language) - 텍스트로 페이지의 구조와 데이터들을 표기하는 언어이다. 확장자는 .html이며 문서를 작성할 수 있는 프로그램이라면 어디서든지 작성이 가능하다. 메모장에서도 가능하다. HTML은 대소문자를 구별하지 않으며 띄어쓰기와 줄바꿈을 구별하지 않는다. 태그 형태로 화살괄호()를 사용하여 표현한다. 데이터 - HTML의 요소 ex) (1)(3)Hello HTML!(2) (1) 여는 태그(Opening Tag): 요소의 이름(p)과 열고 닫는 화살괄호로 구성되어 있다. (2) 닫는 태그(Closing Tag): 요소의 이름 앞에 슬래시(/)가 있다. (3) 내용(Content): 요소의 내용이며, 단순한 텍스트 데이터를 의미한다. - HTML의 특수문자.. 이전 1 다음
