본문 바로가기

Front-End/HTML15

HTML - input 태그 속성 값 value : 입력 칸 초기값 지정 이름을 입력하세요: readonly : 읽기 전용 읽기 전용 입력 칸은 수정할 수 없으나, 마우스로 글자를 탭 하거나 텍스트를 복사할 수 있다. 양식을 제출할 때 읽기 전용 입력 필드의 값이 전송된다! 이름: disabled : 입력 칸 비활성화 비활성화된 입력 필드는 사용할 수 없으며 클릭할 수 없다. 비활성화된 입력 필드의 값은 양식을 제출할 때 전송되지 않는다! 성: 이름: size : 입력 칸의 표시 너비(문자)를 지정, 기본값은 size 20 (알파벳 기준) 참고: size는 text, search, tel, url, email, password에서 작동한다. 주소: 우편번호: maxlength : 입력 칸에 허용되는 최대 문자 수를 지정 (알파벳, 숫자 기준.. 2023. 3. 31.
HTML 태그 - input type ※ 예제로 작성된 부분의 id와 name, label for 부분은 DB, 서버로 넘어갈 때 필요한 요소로 연습 시에는 생략가능 기본값 : 한 줄 텍스트 입력 칸 이름: 성: : 암호 입력칸(입력 시 보통 동그라미 형태로 가려져서 출력) 사용자이름: 비밀번호: : 버튼 : 서버에 form 데이터를 제출하기 위한 버튼을 정의 (DB와 연관된 부분) 이름: 성: : 모든 양식 값을 기본값으로 재설정하는 재설정 버튼(초기화) 이름: 성: : 라디오 버튼, 하나만 선택 가능 위의 HTML 코드가 브라우저에 표시되는 방식은 다음과 같습니다. HTML CSS 자바스크립트 : 확인란, 다중 선택 가능 위의 HTML 코드가 브라우저에 표시되는 방식은 다음과 같습니다. 자전거 자동차 비행기 : 숫자칸, 칸옆에 자동적으로.. 2023. 3. 11.
HTML 태그 - form 2 (form 태그 안에 사용하는 태그) 가장 많이 사용하는 유형, 따로 게시! 여러 양식 요소에 대한 레이블을 정의, 스크린 리더 사용 시 입력 요소에 포커스를 둘 때 라벨을 소리내어 읽어준다. 드롭 다운 목록을 정의한다. Choose a fruit: apple banana peach melon 속성 값 selected 기본적으로 드롭다운 목록의 첫 번째 항목이 선택되는데, 위의 예시에서는 apple 이 기본값, 처음에 보여주는 값을 정의하려면 보여주고 싶은 항목에 selected속성을 추가하면 됩니다. Choose a fruit: apple banana peach melon size 표시되는 값의 수를 지정한다. Choose a fruit: apple banana peach melon 여러 줄 입력 필드(텍스트 영역)를 말한다. 우리집 강아.. 2023. 3. 8.
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.
HTML 태그 한 눈에 정리하기 1 문서 관련 태그 제목, ~까지 사용, 숫자가 커질수록 글자 크기는 작아진다. 텍스트 단락, 내용이 길면 웹 브라우저 창의 너비에 맞게 자동으로 줄이 바뀐다. 줄 바꿈, 텍스트 단락 중 원하는 위치에서 줄을 바꾼다. 내용 인용, 다른 내용보다 들여 쓰고 단락으로 표시한다. 중요한 텍스트를 굵게 표시, 스크린 리더기에서 강조해서 읽어준다. 볼드체, 화면 상 굵게 표시된다. 중요한 태그를 기울게 표시(문장), 스크린 리더기에서 강조해서 읽어준다. 이텔릭체, 화면 상 기울여서 표시된다.(마음속의 생각이나 용어) 내용을 편집할 때 추가한 내용을 표시한다. 내용을 편집할 때 삭제한 내용을 표시한다. 위 첨자 아래 첨자 목록 관련 태그 순서 있는 목록의 시작과 끝을 나타낸다. 순서 없는 목록의 시작과 끝을 나타낸다... 2023. 2. 16.