본문 바로가기

WEB/HTML

 (23)
테이블의 기본 형식 과목별 성적 과목중간시험기말 시험 HTML웹프로그래밍 30 66 알고리즘 28 70 : 테이블에서 하나의 줄에 해당하는 행을 정의하는 태그 : 테이블에서 데이터(이미지,텍스트)가 표시되는 표준셀을 정의/반드시 태그내에서 사용/ 왼쪽 정렬 : 테이블 내부에서 행열의 제목을 표시하는 헤더셀을 정의 / 태그내에서 사용/ 진하게 가운데 정렬 : 테이블 전체에 해당하는 제목을 표시/ 테이블 레이아웃에는 아무런 영향을 미치지 않음/ 반드시 시작태그의 바로 다음에 위치해야 함 / 테이블 상단에 진하게 가운데 정렬 CSS - caption-side 속성과 text-align 속성으로 변경 가능
<iframe> 태그와 이미지 맵 페이지에 창을 삽입하는 태그 : 현재의 페이지 안에서 다른 웹페이지를 표시하는 창을 삽입하기 위한 태그 주요 속성 5가지 • name="이름" - 창의 이름 지정 • src="URL" - 창에 표시될 문서의 URL 지정 • srcdoc="HTML코드" - 창에서 보여줄 HTML콘텐츠 지정 srcdoc 속성이 지정되면 src 속성에서 지정된 콘텐츠는 무시됨. • width="픽셀" - 창의 폭 지정 • height="픽셀" - 창의 높이 지정 네이버 내 페이지 구글 이 브라우저는 iframe 요소를 지원하지 않습니다. 이미지맵 : 하나의 이미지를 여러 개의 영역으로 나누어 각 영역마다 링크를 지정하는 것 ... ▼
HTML - 하이퍼링크 삽입 1. 태그 - 기본 형식 링크를 걸어 줄 내용물(텍스트, 이미지) - 주요 속성 • href="URL" -> 링크를 통해 이동하려는 곳의 경로/ 주소 지정 네이버 원래 크기로 그림을 보려면 여기를
HTML - 그림과 링크 1. 이미지 삽입 - 종료태그 없이 사용 속성 • src ="이미지파일" -> 문서에 표시할 이미지 파일을 지정 일반적인 이미지 파일 형식(GIF/JPG/PNG) HTML문서에 표시할 이미지파일의 이름/경로 지정(필수 속성) • width="숫자" -> 이미지의 폭 지정(픽셀, %) • height="숫자" -> 이미지의 높이 지정 (픽셀, %) 기본 출력 크기 - 이미지의 원본 크기 속성 값 : 픽셀, % 폭과 높이 중에서 하나의 크기가 지정되면 나머지 하나의 값은 원본 크기에 비례해서 자동으로 지정 • alt="내용" -> 이미지가 표시되지 않을 때 대체될 텍스트 이미지가 화면에 표시되지 않거나 이미지가 깨지는 경우를 위해 사용 • usemap="#맵이름" -> 클라이언트 측의 이미지맵 지정
콘텐츠 그룹핑 인라인 요소 블록요소 텍스트요소 -> 기존 내용에 이어서 작성됨 문서 구조요소 -> 새로운 행에 작성됨 입력 내용만큼의 공간을 차지해서 내용을 표시 하나의 줄을 전부 차지해서 내용을 표시 줄바꿈이 수행되지 않아 앞뒤 내용이 이어져서 한 줄에 표시됨 자동으로 줄바꿈 수행 , , ... , , ... 콘텐츠 컨테이너로서 , 태그 태그 블록 요소 인라인 요소 HTML 요소를 묶어 하나의 논리적인 단위의 영역을 구성 텍스트를 위한 컨테이너 논리적으로 구분된 대량의 내용에 대해 CSS스타일 지정 또는 전체 페이지의 공간을 분할하여 레이아웃을 구성하는 데 사용 텍스트의 일부에 대해 CSS스타일 지정 또는 자바스크립트에서 조작할때 유용 div태그의 특징1: 한 줄 공간을 제공 div태그의 특징2: 앞뒤로 자동으로 줄..
목록 지정 목록의 종류 목록의 종류 설명 순서없는 목록(Unordered List) 글머리 기호( • )를 붙여 목록의 각 항목을 표시 ... 자식요소 -> li 순서있는 목록(Odered List) 순서(1,2,3 ...)를 매겨서 목록의 각 항목을 표시 ... 자식요소 -> li 서술 목록(Description List) 어떤 용어나 이름에 대해서 서술하는 형식 ... 자식요소 -> dt, dd 순서 없는 목록을 지정하는 태그 : 각 항목 앞에 순서를 나타내지 않는 기호를 붙여서 표시 CSS를 통해서 기호의 모양을 바꿀 수 있음 항목 1 항목 2 ... 항목 n 태그 :과 태그 내에서 공통으로 사용되는 자식 태그 목록에서 각 항목의 내용을 표현/ 들여쓰기 자동 줄바꿈을 수행 종료 태그없이 사용가능 목록의 종류 ..
글자 스타일 지정 글자 스타일 지정 관련 태그 1. 물리적 스타일 관련 태그 • 단순히 웹브라우저에 표시되는 출력 모양만을 지정하는 태그 --> , , , , , , : 진하게 표시 : 기울어진 형태(이탤릭체)로 표시 : 글자 가운데를 통과하는 줄(취소선)을 표시 : 밑줄을 표시 :글자를위 첨자로 표시 :글자를아래첨자로 표시 : 기본 글자의 크기보다 작은 크기의 글자로 표시 ▼ 태그 설명 : 진하게 표시 - 강조의 의미(X), 주목해야 할 단어를 표시 : 기울어진 형태(이탤릭체)로 표시 - 다른 분위기나 어조, 보통의 서술과 구분되어야 하는 텍스트를 표시 : 글자 가운데를 통과하는 줄(취소선)을 표시 - 더이상 정확하지 않거나 관련이 없는 내용을 표시 : 밑..
텍스트 표현 주석 - 문서 소스의 이해를 돕기 위한 설명을 추가할때 사용 브라우저에 의해 출력되지 않으므로 소스에서만 확인 가능. 태그 내에서는 사용 불가 과목명: HTML 웹프로그래밍 개설학과 : 컴퓨터과학과 담당교수: 빌게이츠 줄을 바꾸는 태그 - 편집기에서 엔터키와 같은 기능 종료 태그 없이 사용 독립된 단락을 생성하기 위해서는 p태그를 사용하며, p 태그를 연속해서 여러개 사용해도 한 번 사용한 것과 같은 효과를 가짐 단락의 정렬은 CSS를 사용한다. 단락을 나누는 태그 - 문단을 나누어 독립된 단락을 생성 다른 내용과의 구분을 위해 단락 전후에서 자동 줄바꿈 수행 공백 및 특수 문자 입력 두 칸 이상의 연속된 공백, 예약어로 사용되는 문자, 키보드로 직접 입력할 수 없는 문자를 입력하는 경우 1. &특수이름..

티스토리툴바