반응형 Frontend 자료집/HTML: FIN9 [HTML] HTML HTML- 웹 페이지의구조와 콘텐츠를 정의하는 마크업 언어- 구조: , , , - 시멘틱태그(SEO): , , , , , , - 텍스트: -, , , , - 리스트: , , - 테이블: , , , - 미디어: , , , - 폼: , , , , , , , , , , 2025. 4. 4. [HTML] 외부파일 연동(CSS, JavaScript) 외부파일 연동더보기더보기TagDescriptioncss 파일 연동javascript 파일 연동외부파일 연동 예시더보기더보기 ... 2025. 3. 5. [HTML] 멀티미디어 태그 멀티미디어 태그더보기TagDescription오디오 태그. controls로 재생바가 보여짐. autoplay로 자동재생. loop로 반복 재생 설정. preaload 속성은 파일을 모두 로딩 후 재생비디오 태그. controls로 재생바 설정. autoplay로 자동재생. loop로 반복 재생. muted로 음소거 설정. poster로 비디오 이미지 설정 멀티미디어 태그 예시더보기 2025. 3. 5. [HTML] 폼 태그 폼 태그더보기TagDescription text 형태의 입력을 받는 태그비밀번호 형태의 입력을 받는 태그. 보안 출력체크박스 태그. value가 보여짐. 복수 개의 선택 가능라디오버튼 태그. value가 보여짐. 라디오버튼 태그들의 name값을 동일하게 작성하면 1개만 선택첨부파일 업로드색상 팔레트로 색상 선택 가능달력으로 날짜 선택입력 값들 초기화.전송 버튼. 데이터 전송됨블록 다운 메뉴로 여러 요소 선택. 의 부모 태그각 선택 블록텍스트 박스내 값 입력. 긴 글 입력폼 태그들의 부모 태그. action은 전송될 주소, method는 전송될 방식 폼 태그 예시더보기 아이디 비밀번호 2025. 3. 5. [HTML] 목록 Tag 목록 Tag- 목록내 목록 태그 중첩 가능더보기TagDescription순서가 없는 태그. 태그의 부모 태그순서가 있는 태그. 태그의 부모 태그목록별 태크정의형 태그. , 의 부모 태그정의하고 싶은 제목정의 내용(설명) 목록 Tag 예시더보기 2025. 3. 5. [HTML] 서식 Tag 서식 Tag더보기TagDescription ~ 제목 태그. 숫자가 커질수록 글자 크기가 작아짐문단 태그특정 영역을 그룹화글자를 굵게. screen reader을 이용하기 위함글자를 기울임. screen reader을 이용하기 위함페이지 링크 연결. target이 blank일 경우 새로운 페이지가 새탭에 열림inline 요소들만 그룹화 시킴이미지 파일 불러오기줄 바꿈 서식 Tag 예시더보기 Title Welcome to cogito30. We learn HTML, CSS 2025. 3. 5. [HTML] Semantic Tag Semantic Tag더보기TagDescriptoin웹 문서의 머리말 영역웹 문서에서 링크 등의 메뉴 영역웹 문서에서 동영상, 사진 등 다양한 멀티미디어를 담는 영역웹 문서의 본문으로 콘텐츠를 담는 역역웹 문서의 본문과 연관성이 적은 외부 영역웹 문서의 특정 영역을 그룹화웹 문서에서 기사나 개별 콘테츠를 담는 영역웹 문서의 꼬리말 영역Semantic Tag 예시더보기 2025. 3. 5. [HTML] HTML 구조 HTML 구조 - : 문서의 타입 지정. html 타입을 설명- : - : 브라우저의 화면에 필요한 설정- : 브라우저의 화면에 표시되는 부분- : 문서의 인코딩 방식 지정. utf-8로 지정- : Explore의 최신버전 유지- : 웹 브라우저 종류에 따라 동일한 화면을 보여주기 위해 필요- : 웹 브라우저의 탭 제목을 설정 - 부모 태그: 자식 태그를 감싸는 태그- 자식 태그: 부모 태그로 감싼 태그 2025. 3. 5. [HTML] 참고자료 - [Doc] HTML Standard- [Doc] MDN: HTML- [Site] HEROPY Tech: HTML, CSS 첫걸음- [Site] TCP SCHOOL: HTML- [Video] Do it! 프런트엔드 웹 디자인 입문- [Video] Do it! 반응형 디자인- [Video] Do it! HTML+CSS+자바스크립트 웹 표준의 정석- [Video] Do it! 인터랙티브 웹 페이지 만들기 2025. 3. 5. 이전 1 다음 반응형
