HTML 06. 하이퍼링크 관련태그
2022. 12. 9. 16:26
Front/HTML
하이퍼 링크 - 웹문서의 가장 핵심적인 기능으로 뭔가를 클릭해서 다른곳으로 편리하게 이동할 수 있도록 도와줌 - 텍스트를 클릭해서 링크를 이동하는 방법, 이미지를 클릭해서 넘어가는 방법 등 존재 - 현재 페이지 내에서 이동하는 방법도 있음 글자관련태그 목록관련태그 네이버 HTML 삽입 미리보기할 수 없는 소스 * target 속성 : 연결된 페이지를 어느탭에서 열 것인지 지정 (_self (현재탭) , _blank(새탭)) HTML 삽입 미리보기할 수 없는 소스 * img 이용해서 링크만들기 * 도형이용해서 링크만들기 HTML 삽입 미리보기할 수 없는 소스 * 한페이지내에서 위/아래/지정 한 곳으로 점프하는 링크 만들기 : 이동하고자하는 곳에 아이디를 부여한 후 href="#id"로 작성 위쪽으로 올라가..
HTML 05. 입력양식 및 폼 관련 태그(2)
2022. 12. 8. 16:41
Front/HTML
1. text와 관련된 input태그의 타입 : 한줄짜리 텍스트를 입력할 수 있는 텍스트 상자 (type속성의 기본값) 아이디 : >> placeholder :텍스트 입력전에 해당 내용에 대한 설명 maxlength : 입력할 수 있는 최대길이 설정 required : 필수로 입력받아야하는 속성으로 입력 안했을시 제출 불가
HTML 05. 입력양식 및 폼 관련 태그(1)
2022. 12. 8. 16:10
Front/HTML
1. 입력양식 관련 태그 - 태그 : 사용자에게 값을 입력받을 수 있는 텍스트 상자 또는 체크박스 등을 만들 수 있음 아이디 : 비밀번호 : 성별 : 여 남 HTML 삽입 미리보기할 수 없는 소스 2. 폼 관련 태그 - 태그 내에 submit 버튼 클릭시 해당 form안에 작성된 사용자가 입력한 값들을 서버로 전송하면서 요청하는 역할 수행 - action : 해당 form에 사용자가 입력한 값들을 전달하면서 요청할 서버의 경로 제시 - method : 요청 전송방식을 지정하는 속성 (get(기본값) | post) > get 방식: 사용자가 입력한 값들이 요청시 url에 노출되는 방식 / 전달값에 대한 크기제한있음 > post방식: 사용자가 입력한 값들이 요청시 url에 노출되지 않는 방식 / 크기제한 없..
HTML 05_영역관련 태그
2022. 12. 8. 15:44
Front/HTML
블럭요소 : 한줄 단위로 영역을 차지하는 요소 줄바꿈이 적용되어 이미 존재하는 태그의 다음줄에 영역이 잡힘 (p, pre, div) 인라인요소 : content(내용)영역에 해당하는 부분만 영역을 차지하는 요소 줄바꿈이 적용되지 않아 옆으로 영역이 잡힘( 다음줄로 넘어가려면 ) (b,mark,s,img, "span") div 태그와 span태그의 차이점 1: 줄바꿈 적용 - div : 블럭요소로 한줄단위로 영역차지( 이미존재하는 요소 다음 줄에 영역이 잡힘) 첫번째 영역 두번째 영역 세번째 영역 HTML 삽입 미리보기할 수 없는 소스 -span: 인라인 요소로 content영역만 차지(줄바꿈이 발생되지 않고 옆으로 배치) 첫번째 영역 두번째 영역 세번째 영역 HTML 삽입 미리보기할 수 없는 소스 div..
HTML 04. 이미지 및 멀티미디어 관련 태그
2022. 12. 7. 17:12
Front/HTML
1. 이미지 관련 태그 * src속성 * alt속성 -사진의 경로가 잘못되거나 이미지를 제대로 표현할 수 없는 경우 대체 텍스트의 용도 -시각장애인들을 위한 스크린리더(화면낭독기)에서 이미지를 읽어주는 설명 문구 *width와 height 속성 이미지의 가로, 세로길이 조정 가능 고정길이(px), 가변길이(%) 단위 지정 => 단위 생략시 기본값 px 고정길이(px) : 화면사이즈가 조정이 되어도 이미지의 크기 변동없음 가변 길이(%) : 화면사이즈 또는 부모요소의 사이즈에 따라 이미지 크기 같이 변동 2. 오디오 관련 태그 src : 오디오 경..
HTML 03. 테이블관련 태그
2022. 12. 7. 17:07
Front/HTML
- 표 : 웹문서에서 자료를 정리할 때 자주 사용, 행과 열로 이루어져 있고 행과열이 만나는 지점을 "셀"이라고 함 : 기본적인 표를 생성해주는 태그 : 표의 한행을 나타내는 태그 : 표의 제목 셀을 나타내는 태그 => 글자 굵게, 가운데 정렬됨 : 표의 일반 셀을 나타내는 태그 1. 기본적인 표만들기 웹브라우저의 종류 브라우저명 제조사 홈페이지 Internet Explorer MS http://www.microsoft.com Chrome Google http://wwww.google.com Safari Apple http://www.apple.com
HTML 02. 목록관련 태그
2022. 12. 7. 16:49
Front/HTML
1. ul : 순서가 없는 목록태그 - 안에 로 입력 ul : 순서가 없는 목록 태그 HTML CSS JavaScript jQuery 중첩으로도 사용 가능 HTML 글자관련 목록관련 CSS JavaScript jQuery
HTML 01. 글자관련 태그
2022. 12. 7. 16:35
Front/HTML
관련태그 (h1~h6) 한줄단위 영역 차지하고있으며 h1에서 h6으로 갈수록 글자 크기 작아짐 h1태그입니다. h2태그입니다. h3태그입니다. h4태그입니다. h5태그입니다. h6태그입니다. HTML 삽입 미리보기할 수 없는 소스 문단을 나누는 태그 : 줄바꿈하고자한다면 별도의 태그 작성해야됨, 공백은 하나의 공백만을 표시하기 때문에 로 표시 : 시작태그부터 종료태그까지 입력된 내용 그대로 표현, 줄바꿈이나 여러개의 공백 바로 표현함 문단을 나누는 태그 : p,pre 문단 영역을 나누는 태그로는 p태그와 pre태그가 있다. p태그는 줄바꿈하고자 한다면 별도의 태그를 작성해야됨 그리고 공백은 한 개의 공백만을 표시하기 때문에 별도의 기호 문구를 기술해야됨 pre 태그는 시작태그에서부터 종료태그까지 입력된 ..