몽키의 코딩작업실

태그 속성1. 기본적인 속성 controls: 비디오 재생, 멈춤, 음소거 등의 UI 버튼 제공 autoplay: 페이지가 로드될 때 자동으로 재생 muted: 음소거 상태로 시작 loop: 영상이 끝나면 다시 처음부터 반복 재생 poster: 영상이 실행되기 전에 보이는 썸네일 이미지 2. preload 속성 (비디오를 미리 로드하는 방식) auto: 사용자가 볼지 말지 관계없이 영상을 미리 다운로드, 중요한 영상일 경우 사용 metadata: 영상 데이터를 다운로드하지 않고, 길이 등의 메타 정보만 가져옴 none: 영상 데이터를 미리 다운로드하지 않음 (트래픽 절약)  태그 (비디오 자막 추가)1. 자막 관련 속성 srclang: 자막의 언어 (ex. ko → 한국어, en → 영어) label: ..

1폼 요소 (form)사용자의 데이터를 입력받는 HTML 요소2체크박스 입력 (type=“checkbox”)여러 개의 선택지를 동시에 선택3라디오 버튼 입력 (type=“radio”)한 그룹 내에서 하나의 선택지만 선택4색상 선택 (type=“color”)색상 팔레트에서 색을 선택5날짜 및 시간 입력날짜와 시간을 선택할 수 있는 입력5.1날짜 입력 (type=“date”)날짜를 선택할 수 있음5.2날짜와 시간 입력 (type=“datetime-local”)날짜와 시간을 함께 선택할 수 있음5.3월 선택 (type=“month”)연도와 월만 선택할 수 있음5.4주 선택 (type=“week”)해당 연도의 몇 번째 주 선택5.5시간 입력 (type=“time”)시간만 입력할 수 있음6숫자 입력 (type=“..

순서 없는 목록 (ul)• 순서가 중요하지 않은 항목들을 나열할 때 사용• 태그 안에 태그로 항목을 나열• 예시: 목록 순서가 중요하지 않은 경우 (예: 쇼핑 목록)순서 없는 목록 순서 없는 목록1 순서 없는 목록2 순서 없는 목록3 순서 있는 목록 (ol)• 항목에 순서가 중요한 경우 사용• 태그로 목록을 만들고, 항목은 태그로 표시• 예시: 준비물 목록, 작업 순서 등순서 있는 목록 순서 있는 목록1 순서 있는 목록2 순서 있는 목록3  설명 목록 (dl)• 특정 용어나 정의를 설명할 때 사용• 태그로 시작하고, 는 설명할 용어, 는 그 용어에 대한 설명을 작성• 예시: 용어집,..

1. 볼드체 태그 (b, strong) 단순히 텍스트를 굵게 표시하는 태그. 의미는 없고, 오직 스타일링만을 위한 태그텍스트를 강조하는 의미를 가진 태그. 시각적으로 볼드체처럼 보이지만, 중요한 내용을 강조할 때 사용검색 엔진이나 스크린 리더기에서는 이를 중요한 문장으로 인식하고, 시각적으로도 중요성을 강조시각장애인에게는 더 크게 읽어줌 2. 이탤릭체 태그 (i, em)단순히 이탤릭체(기울임꼴)를 적용하는 태그. 디자인적인 효과만 있고, 의미가 특별히 부여되지 않음강조된 이탤릭체. 텍스트를 강조하는 의미를 담고 있어. 시각적으로는 이탤릭체지만, 스크린 리더기나 검색 엔진에서는 강조된 텍스트로 해석되며 더 중요한 텍스트로 인식 3. 기타 텍스트 스타일 태그텍스트를 작게 표시형광펜으로 마킹한 것처럼, 중요한..

1. 인라인 스타일 (Inline Style)• HTML 태그 안에 style 속성을 사용해서 스타일을 지정하는 방법• 이 방식은 태그마다 직접 스타일을 적용하므로, 다른 부분에 영향을 주지 않고 해당 태그만 스타일을 수정가능 빨간색 글자입니다.   2. 익스터널 스타일 (External Style)• 외부 CSS 파일을 만들어서 링크하는 방법• 보통 여러 페이지에 동일한 스타일을 적용할 때 이 방법을 사용• HTML 파일과 CSS 파일을 분리하면, 코드 관리가 쉬워지고 유지보수도 간편 CSS 파일 (styles.css):p { color: red;}  3. 인터널 스타일 (Internal Style)• HTML 파일 내 태그 안에  어떤 방식이 좋을까?• 인라인 스타일은 짧은 HTML 문서에서 ..