본문 바로가기

HTML63

2월 27일 (2) 실습 + 반응형 웹 만들기 실습(실습기록) 이미지 슬라이더 만들기 테이블 스타일링 드룹다운 메뉴 만들기 배경이미지만 투명하게 처리하기 반응형 웹이란? 하나의 사이트 페이지로 데스크톱(컴퓨터), 스마트폰, 스마트패드 등 접속하는 장치(디스플레이 종류)에 따라 요소의 크기 및 배치, 표시 등을 자동으로 변환하도록 웹 html head 태그의 meta 태그에 viewport를 설정하여 반응형 웹 페이지를 제작 meta 태그란? 해당페이지의 정보(메타데이터)를 제공하기 위해 사용하는 태그 사용자에게 보여지는 태그는 아니다. 브라우저에게 작업을 지시하는 태그, 데이터의 데이터 속성종류) 1. name : 메타데이터의 종류를 지정하는 속성 2. content - name에 따라 분류된 메타데이터의 내용을 작성하는 속성 name 주요속성값 d.. 2023. 2. 27.
HTML 태그 - form 사용자 입력을 위한 HTML 양식을 만드는 데 사용된다. 사용자 입력을 수집하는 데 사용된다. 사용자 입력은 대부분 처리를 위해 서버로 전송된다. 서버로 넘기는 영역까지가 form의 역할 form은 텍스트 필드, 확인란, 라디오 버튼, 제출 버튼 등과 같은 다양한 유형의 입력 요소에 대한 컨테이너이다. . form elements . 태그의 속성 action 양식이 제출될 때 수행할 작업을 정의한다. 일반적으로 사용자가 제출 버튼을 클릭하면 양식 데이터가 서버의 파일로 전송된다.(back-end 영역) 전송처리 관련 기술 : php, asp, jsp 등 예> 제출할 때 양식 데이터를 "action_page.php"(임의로 지정)로 보낸다. . form elements . method 양식 데이터를 제출할.. 2023. 2. 21.
HTML 태그 한 눈에 정리하기 2 에서 사용하는 태그 폼의 시작과 끝은 만든다. 폼 요소를 그룹으로 묶는다. 필드셋에 제목을 붙인다. 사용자가 내용을 입려할 필드를 삽입한다. , 드롭다운 목록을 삽입한다. 텍스트를 여러 줄 입력할 수 있는 텍스트 영역을 삽입한다. 2023. 2. 20.
2월 17일 (2) HTML - input가 아닌 입력 태그 input이 아닌 입력 태그들 기타 입력 태그(와 관련 속성들) p154 1. textarea : 여러 줄의 문장(문자열)을 입력받는 요소용 태그 크기 지정 속성 rows : 높이(세로) 길이 지정, 줄, 라인 cols : 너비(가로) , 길이 지정, 글자 수 시작태그와 종료 태그 사이에 값을 전송(value 안 씀!) 공간의 크기를 변경할 수 있다.(기본값) 크기 변경 무효 : style="resize: none;" 여기에 쓰는 내용이 전송됩니다. 띄어쓰기를 하면 화면상 파란색 부분의 공백이 생긴다. 끊어서 코딩하고 싶으면 >를 포함해서 가지고 내려간다. 여기에 쓰는 내용이 전송됩니다. 크기 지정을 하고 쓴다. 지정한 크기 범위를 넘어갈 경우 자동으로 줄 바꿈이 되고 스크롤이 생긴다. 노란색 부분을 마.. 2023. 2. 17.
2월 17일 (1) HTML - input type 속성 태그 type속성 속성값에 따라 다양한 입력 형태를 활용할 수 있다. 날짜 관련 type data, month, week, time, datetime-local 숫자 입력 형태의 부가속성 1. min : 최소값을 설정, 설정한 값 미만의 값 입력 불가 2. max : 최대값을 설정, 설정한 값 초과의 값 입력 불가 날짜 및 시간 지정 형식 yyyy-mm-dd : y 연도형식, m 월 형식, d 일 형식 표시에 맞추어서 날짜 최소, 최대값을 지정해야 한다. 시간입력 : name 값을 지정해 주었을 때, 데이터가 전달되는 모습 datetime-local 해당 나라에 맞추어서 연-월-일-시간순 다른 나라에서 사용 시 월-일-연도-시간 순으로 나타난다. html 시계 표시에서는 초는 다루지 않는다. 날짜와 시간.. 2023. 2. 17.
2월 16일 (2) HTML - 입력 양식 작성하기 입력 양식 작성하기 form 태그 사이트에 사용자가 정보(데이터)를 입력할 수 있는 요소를 묶는 역할 사이트의 back-end로 데이터를 전송하는 목적으로 활용한다. 서버로 넘기는 영역까지가 form의 역할이다. html 페이지에서 html 페이지로의 데이터 전송은 할 수 없다. 전송처리 관련 기술 : php, asp, jsp 등 사용하는 방법 주요 속성 p 123 1. action : 입력 데이터를 보낼 back-end의 식별정보 2. method : get/post방식을 지정하는 속성 3. name : 자바스크립트 코드(프로그램) 부분에서 해당 form부분을 제어할 때 활용하는 식별 값 지정 관련 태그들 p 130 입력란을 만드는 태그, inline 요소를 가지고 있다. 입력태그의 모양을 결정하는 속.. 2023. 2. 16.