$$config title: [블로그]?유튜브 프로그래밍 관련 영상 시청 후기 keywords: - 노마드코더 - css js로만 할수 있다고 있다 생각한 것을 html로도 가능하다 $$ # 영상(22.01.17) ## css js로만 할수 있다고 있다 생각한 것을 html로도 가능 $$youtube https://www.youtube.com/watch?v=EMOlLLTAZMs $$ - 자동완성 기능으로 빌드 가능 - 개발자로서 시간은 가장 중요한 것. 시간 단축을 시켜드림 - progress태그 - 1줄로 진행률 표시해줌 - max, value로 진행률이 설정됨 - 원한다면 css로 추가 커스터마이징 가능 - meter태그 - 유저에게 값의 수준을 보여줌 - 값이 높고 낮음에 따라 색상이 바뀜 - 작업의 진행상황과는 관련이 없음 - 추가로 가진 속성이 많음 - value. min. mx. low. high. optimum - css pseudo classes를 활용해서 커스터마이징 가능 - 최적값 등.. - detail태그 - ㄴ 내부에 summary태그 - 유저의 클릭으로 정보를 보여주고 숨기는 패턴 - summary태그 = 클릭 가능한 요약부분 - summary 후에 나오는 태그는 유저가 클릭한 후에만 표시 - 클릭 여부에 따라 삼각형을 돌릴 수도 있음 - detail태크게는 open이라는 css셀렉터가 있음 - 유저의 클릭에 따라서 스타일 변경에 사용이 가능함 - 달력 - input type="week"를 통해 1년 중 주를 선택할 수 있음 - input type="time"를 통해 시간을 선택할 수 있음 - picture태그 - picture태그는 각기 다린 버전의 이미지 표시가 가능 - 유저의 장치나 환경에 따라서 - 모바일유저에겐 낮은 해상도의 이미지로 빠른 페이지 로딩 - 브라우저가 일정 태그를 지원하지 않는 경우 대체 - 브라우저가 포멧 지원, 장치, 크기정을 확인 - picture태그는 img태그, source태그와 함께 사용됨. ```html

``` - datalist태그 - JS없이 자동완성을 가능하게 해줌 - input값을 가져야 함 ```html 자동완성선택 ```