조금씩 천천히

8. Html interactive content ### details, summary : 모든 브라우저에서 지원하지 않는다. 사용 전 브라우저 체크가 필요. -details : 열고 닫는 인터렉션이 가능. 토글되는 형태, open 속성을 사용하면 열린상태를 기본으로 보여준다.(기본값은 닫혀있음) - summary: style 작성시 transition 을 주면 인터렉션 적용이 가능하다. loading… 이미지 다운로드 중 사운드 다운로드 중 ### dialog : 윈도우상의 모달이 노출, 혹은 버튼을 통해 박스레이아웃이 노출되는 것을 브라우저의 기본 효과로 보여주는 요소(모달창과 비슷). 기본적으로는 노출이 되지 않기 때문에 버튼을 눌렀을때 노출을 시키거나 혹은 open 속성을 활용해야 노출이 가능하다..

7. Html forms ### label, input - input: type 에 따라 자동완성이 달라지기도 하고, 모바일의 경우 가상키보드의 레이아웃이 달라진다. 데스크탑은 입력값이 달라진다. - label: label 의 for 값과 input 의 id 에 동일한 값을 넣으면 label 을 선택시 input 에 포커스가 간다. Input 과 label 을 항상 연결해준다. ### fleldset, legend : form 내부에서 구역을 나눌 때 사용한다 - fieldset : form 을 그루핑 시켜 관심사가 묶여있는 여러 input 요소를 그루핑 할 때 사용 - legend: fieldset 으로 그루핑된 영역의 타이틀을 표시한다 ### button - button 의 기본 목적은 form 을 ..

6. Html table (tabular data) ### table: 표 요소 // 테이블의 기본 구조 표의 제목 표의 셀 // td의 개수는 다른 tr 의 td 개수와 항상 동일해야한다. 표의 셀 표의 셀 표의 셀 ### caption: 테이블의 제목, 설명을 나타낼때 사용하는 요소. 필수요소는 아니지만 가급적 작성하는 것이 좋다. 2020 넷플릭스 기대작 2020 넷플릭스에 업데이트 되는 콘텐츠를 제목, 작성일로 요약해보았습니다. 제목 작성일 안녕 조제, 호랑이 2020-12-31 ### thead, tbody, tfoot - 테이블 제목, 본문, 결과 영역. 순서는 상관 없으나 순서대로 작성하는 것이 좋다. 2020 넷플릭스 기대작 2020 넷플릭스에 업데이트 되는 콘텐츠를 제목, 작성일로 요약해..

4. Text-level semantics Html 요소 내에서 텍스트로 취급되는 요소들 텍스트 사이에서 텍스트로 취급되는 요소 ### a 요소 - html 내에서 하이퍼텍스트(링크)를 생성할 때 사용하는 요소. Href 속성은 필수가 아님. 활성화/비활성화 상태를 나타낼때 href 속성을 넣었다 뺄 수 있다. A 내부에는 a 태그를 넣을 수 없다.(= 인터렉티브 콘텐츠 내에는 다른 인터렉티브 콘텐츠를 넣어서는 안된다. ) - a 요소의 해시링크 : href 와 id 의 해시링크를 연결해주는 것 ### em, strong 요소 - 강조를 나타내는 요소 - strong : 조금 더 강한 강조, warning, attention , 꼭 봐야해! 같은 느낌, 주의하세요 느낌 - em : 보편적인 강조. ###..

1. Document metadata - head 내부에 들어가는 주요 요소들 ### Meta 요소 - 해당 문서 혹은 애플리케이션의 메타데이터를 담는 요소 1. Charset - 문자 인코딩을 어떻게 할 것인지 결정 - Utf-8 : 전세계 언어 대부분을 지원 - euc-kr : 한국어와 영문을 지원 2. Viewport - 모바일 브라우저에서 화면을 어떻게 노출시킬 지 - 뷰포트가 없으면 모바일 브라우저에서 화면 렌더링이 이상하게 동작함 3. Seo 에 도움을 주는 메타데이터 - description : 사이트에 대한 정보 // description 이 없으면 웹페이지의 body 요소의 첫번째 의미있는 요소를 긁어가진다. 4. 소셜메타데이터 // open graph protocol : 페이스북에서 개..

태그란? 태그는 '' 를 사용하여 표현하고 ''안에 태그 이름이 들어간다. 시작하는 태그와 닫는 태그가 한 쌍을 이루는데, 닫는 태그에는 '/' 기호를 사용하여 구분해준다. 그리고 시작, 종료태그 사이에 웹에 표현할 내용을 적어준다. 제목을 표현하는 heading 태그 제목을 표현하는 heading 태그 요소(element)란 시작태그, 닫는태그, 콘텐츠를 포함한 전체를 요소라고 한다. 속성 속성은 태그에 추가적인 정보를 줄 때 사용한다. 실제 표시되는 컨텐츠에는 나타나지 않는다. 속성은 속성명과 속성값으로 이루어져 있으며 시작태그의 태그명 뒤에서 속성명="속성값"의 형태로 작성한다. 안녕하세요. html!! 안녕하세요. html!! // 태그명 뒤에 공백이 없음