eunsol's story

HTML-Audio(오디오) -웹브라우저에서 음악을 재생 할 수 있게 만들어주는 태그 속성 src 파일 경로 지정 preload 음악을 재생하기 전에 데이터로드에 관한 설정 -auto:자동로드 -metadata: 정보만 로드 -none: play 전에 로드하지 않음 autoplay 음악을 자동 재생할 지 지정 loop 음악을 반복할 지 지정 controls 음악 재생 도구를 출력할 지 지정 muted 소리 재생하지 않도록 함 브라우저와 오디오 포맷과의 관계 - 브라우저 마다 재생할 수 있는 파일의 확장자가 다른데, 이를 해결할 수 있는 방법 - type속성을 지정해 주지 않으면 속도저하의 문제가 발생할 수 있다. 속성 src 비디오 파일의 경로 type MIME-type 지정 비디오 파일의 MIME-ty..

HTML-Video(비디오) -웹 브라우저에서 영상을 재생할 수 있게 해준다. -웹 브라우저 마다 지원하는 동영상 파일 형식이 다르다. -MP4, WebM, Ogg 형식만 지원 속성 src 비디오 파일의 경로 poster 비디오 준비 중일 때 의 이미지 파일 경로 지정(썸네일) preload 비디오 재생 전에 데이터 로드에 대한 상황 지정 -auto:자동로드 -metadata: 정보만 로드 -none: play 전에 로드하지 않음 autoplay 비디오를 자동 재생할 지 지정 loop 비디오를 반복 재생할 지 지정 controls 비디오 재생 도구를 출력할 지 지정 muted 소리 재생하지 않도록 함 width,height 비디오의 너비와 높이 지정 브라우저와 동영상 포맷과의 관계 - 브라우저 마다 재생..

HTML-Img(이미지) 이미지(img) - 웹 문서에 텍스트가 아닌 이미지를 삽입할 때 사용 속성 -src: 이미지 파일의 경로 -alt: 이미지가 보이지 않는 환경에서 대체 텍스트를 제공하기 위한 목적으로 사용, 이미지와 동등한 정보를 제공해야 합니다. -width,height: 이미지의 가로/세로 이미지의 종류 jpg: 압축률이 가장 뛰어남, 컬러 제한 없음 png:무손실 압축-8bit: 컬러제한-24bit: 컬러제한 없음, 투명 픽셀 지원 gif: 컬러 제한 svg: 벡터 이미지, 용량이 작다 많이들 아시는 jpg는 압축률이 가장 뛰어난 확장자입니다. 그에 비해 gif는 움직이는 애니메이션 이미지로 압축률이 가장 떨어지지만 감정이나 농담을 전달할 때 많이 쓰입니다. 가장 생소한 확장자가 svg가 ..

HTML-책갈피 사용하기 하이퍼링크: a요소는 텍스트나 이미지 콘텐츠에 링크를 설정할 때 사용 인라인 요소 a요소의 href속성값에 #id속성값을 지정하면 id속성으로 지정된 문서 내 특정 위치로 이동 요소에 이름 정하기 아이디(id) 클래스(class) ID(아이디) 중요한 곳에 붙인다. # Class(클래스) 여러곳에 같은 이름 사용할 때 쓰인다. 덜 중요한 곳 # 책갈피 사용 1. 같은 페이지에서 연결할 때 -원하는 곳에 이름 지정(id넣기) -href속성에 아이디 이름 지정 http://file:///C:/%EC%9D%80%EC%86%94%20html/lesson02/link/link01/index.html#top 위의 파일을 열어보면 독서진흥시책에 대한 정보가 나옵니다. 하이퍼링크가 걸려있는 목..

HTML-Outliner outliner란 HTML5에서는 정보구조를 명확히 할 수 있도록 '아웃라인 알고리즘'이라는 개념이 도입되었습니다 아웃라인 알고리즘은 웹페이지이 정보 구조를 판별할 수 있는 개념으로 책의 목차와 비슷합니다. https://gsnedders.html5.org/outliner/ 위 링크는 내가 짠 HTML 코드가 구조에 맞게 짜여졌는지 확인해주는 사이트입니다. outliner는 hn요소를 사용하여 표현할 수 있습니다. hn요소는 문서 내부의 콘텐츠 제목을 정의하는 요소입니다. 대제목 중제목 소제목 소소제목 소소소제목 소소소소제목 위의 이미지를 시맨틱 웹과 아웃라인을 함께 적용하여 코드소스를 짜보겠습니다. 먼저 코드소스를 짜고 확인해보시면 좋겠습니다. 경로 절대경로 네이버 이번 시간에..

HTML이란 (Hypertext Markup Language,하이퍼텍스트 마크업 언어) 프로그래밍 언어는 아니고, 우리가 보는 웹페이지가 어떻게 구조화되어 있는지 브라우저로 하여금 알 수 있도록 하는 마크업 언어입니다. HTML의 기본 구성요소 태그(Tag): 태그는 로 묶어서 표현하는 명령어를 말합니다. 기본 형식은 ~입니다. 속성(Auttribute):시작태그는 태그의 의미와 필요에 따라 개별적인 옵션을 가질 수 있습니다. 이러한 옵션을 속성이라고 합니다. 값(Value): 각 속성이 가지는 값을 의미합니다. 요소(Element): 여는 태그, 닫는 태그, 내용을 통틀어 요소(element)라고 합니다. 그렇다면 다음 문장의 단락을 나누기 위해서는 어떻게 해야할까요? 일방통행 빛나는 항상 직진 아무도..