본문 바로가기

HTML7

[HTML] html이란? html 개념잡기 HTML이란? - Hyper Text Markup Language 웹에서 사용하는 마크업 언어 - 인터넷 상에서 사용하는 웹페이지의 정보를 표현하기 위한 언어 하이퍼텍스트 - 단위 텍스트들과 이것들을 결합하는 링크로 구성- 사용자가 연상하는 순서에 따라 관련 있는 쪽으로 이동하여 정보를 얻음 마크업(태그/tag)- 문서의 구조와 추가적인 정보를 부여하기 위해 문서 내에 삽입되는 일련의 문자 또는 기호- 문서는 내용(content), 구조(structure), 스타일(style) 로 나뉜다. 내용(content) 구조(structure) 스타일(style) - 의미적 마크업- 제목태그, 주소태그 등- , 등 - 구조적 마크업 - 문단태그, 제목글 태그 등 - , , 등 - 양식적 마크업- 모양, 색상 등-.. 2018. 4. 9.
[HTML] html의 특징과 단점 HTML 특징(장점)? 웹 문서의 표준- 수정 및 관리가 용이하다.- 웹 접근성이 향상된다.- 호환성을 확보할 수 있다. 마크업 언어- 파일 용량이 작아 클라이언트-서버 간 빠른 문서 전달이 가능하다. 일반적인 텍스트 파일- 별도의 전용 프로그램이 아닌 간단한 메모장과 같은 편집기로도 충분하다. 컴퓨터 시스템과 운영체제에 독립적- 텍스트 문서 → 어떤 시스템/브라우저에서도 사용이 가능하다. HTML 단점? 웹 문서의 내용 표현에 집중 - 내용의 의미보다는 내용을 외양적으로 표현하는 태그에 치중 구조화된 정보의 표현과 검색의 어려움- 정보의 구조화 및 데이터 간의 연관성 표현의 어려움 제한적인 태그- 사용의 편의성이 있지만, 융통성 및 확장성이 결여 문서의 유효성 검증과 제약조건 정의의 어려움- 구조화되어.. 2018. 4. 9.
[CSS] CSS란 무엇인가? CSS란 무엇인가? 1. CSS란? - Cascading Style Sheets 는 documents가 사용자에게 어떻게 보여질까를 기술하는 언어이다.- HTML이 정보를 표현한다면 CSS는 HTML문서를 시작적으로 이쁘게 꾸며주는 역할을 한다. 2. CSS로 기대되는 효과? - 정보(HTML)와 디자인(CSS)를 분리하여 관리할 수 있다.- 정보를 수정하지 않고 디자인만 변경할 수 있다.> 태그마다 style 속성으로 주게 되면 소스코드가 지저분해 지는데, 분리하여 관리하게 되면 유지보수 및 가독성이 좋아진다.- 검색엔진이 HTML을 해석 가능하도록 하기 때문에 더 많은 방문자들이 방문할 수 있도록 유도할 수 있다.> 시각장애인을 위한 스크린리더 프로그램이 HTML문서를 해석하도록 할 수 있다.(웹접근.. 2018. 4. 6.
embed 태그 / aidio 태그 / video 태그의 사용 1. embed 요소 - 외부 애플리케이션이나 상호작용 콘텐츠를 위한 컨테이너 - HTML4.01 에서는 embed 태그를 지원하지 않는다. 속성 값 설명 src "URL" 내장되는 외부 파일의 주소/이름 height "픽셀" 내장되는 콘텐츠의 높이 width "픽셀" 내장되는 콘텐츠의 폭 type "미디어타입" 내장되는 콘텐츠의 미디어 타입 2. audio 요소 - 외부 플러그인의 도움 없이 오디오 재생 * 사용법 audio요소를 지원하지 않는 브라우저에서 대체 표시할 내용 * 활용법 속성 값 설명 src "URL" 재생할 오디오 파일의 URL autoplay "속성값" - 웹 문서 로딩 시에 오디오를 자동으로 재생할 지 여부 - 속성값 없이 사용 가능 → 속성명만 표시 - 속성값을 사용하는 경우 → .. 2018. 4. 5.
[HTML] HTML에서의 테이블표현 1. 태그 - 태그 > HTML에서 테이블을 정의하는 태그 > m행 x n열 → m개의 태그, 각 태그 내에서 n개의 태그 > border-spacing 속성으로 테이블간 셀들의 간격을 조절할 수 있다. (px단위) - 태그 > table에 해당하는 제목을 표시 > 테이블 레이아웃에는 아무런 영향을 미치지 않음 > 반드시 의 시작태그 바로 다음에 위치해야 함 → 테이블에서 하나의 줄에 해당하는 행(row)을 정의하는 태그 > 또는 태그를 포함해야만 사용 가능 - 태그 > 테이블에서 데이터가 표시되는 표준 셀을 정의 > 반드시 태그 내에서 사용 > 셀 내용 → 왼쪽 정렬로 표시 - 태그 > 테이블 내부에서 행/열의 제목을 표시하는 헤더 셀을 정의 > 반드시 태그 내에서 사용 > 셀 내용 → 진하게 가운데 .. 2018. 4. 4.
[HTML] img태그와 a링크태크표현 1. 이미지를 삽입하는 태그 속성 값 설명 src "이미지파일" (상대경로, 절대경로 등) * 상대경로 - - - 현재 문서를 기준으로 파일 위치를 작성 - 필수속성 * 절대경로 - 문서에 표시할 이미지 파일 지정 width "숫자" (픽셀, %) - * 단위를 지정하지 않으면 px 단위 * 기본 출력크기 = 이미지의 원래 크기 * 폭/높이 중에서 하나의 크기만 지정되면 나머지 하나는 원본 크기에 비례해서 자동으로 지정 이미지의 너비(폭) 지정 height "숫자" (픽셀, %) - * 단위를 지정하지 않으면 px 단위 이미지의 높이 지정 alt "내용" (텍스트) * 이미지경로가 틀렸거나 손상이 되었을때, 대체텍스트가 나오게 된다. 이미지가 표시되지 않을때 대체텍스트 지정 usemap "#맵이름" 클라.. 2018. 4. 4.