웹프로그래밍 썸네일형 리스트형 [HTML] 오디오, 비디오, 자막 1. 오디오를 배치할 때 쓰이는 태그다. 기본적인 형식은 이다. 사용되는 속성으로는 controls, src, loop, autoplay가 있다. controls은 플레이나 재생버튼 등의 제어기가 표시되는것을 True로 설정해 표시하게 명시한다. src는 파일위치, loop은 끝나고 다시 처음부터 재생여부, autoplay는 자동으로 플레이(권장x) See the Pen Untitled by siloam72761 (@siloam72761) on CodePen. 2. 비디오를 배치할 때 쓰이는 태그다. 기본적인 형식은 이다. audio에서 처럼 여러개의 video파일을 src에 저장하고 웹이 제일 먼저 호환되는 파일을 선택하게 한다. 네트워크 상황에 따라 화질이 높거나 작은 비디오 파일을 보낼 수는 없다... 더보기 [HTML] 이미지 태그 활용과 그래픽 1. 이미지 종류 GIF - 넓은 부분의 한 색에 대해서 압축 능력이 좋다. 256개의 색깔 표현이 가능하다. 투명화도 가능하나, 모서리 부분이 들쭉날쭉 할 수 있다. 여러개의 프레임을 가지고 있고, 짧은 동영상 표현이 가능하다. SVG - Scable Vector Graphic의 약자 수학과 벡터로 이루어져 있기 때문에, 이미지의 크기를 정하는데 있어서 크고 늘리는데 손실이 없다. 파일 사이즈가 굉장히 작다. JPG - 사진과 같은 이미지에 맞는 형태다. 파일의 색을 단순화함으로써 압축을 할 수 있으나, 이미지 손실이 일어날 수 있다. 압축 시 크기와 이미지의 품질 중에 선택하게 된다. PNG - 웹에서 gif와 jpg보다 새로운 등장한 형식이다. 이미지의 투명성이 필요할 때 유용하다. jpg나 gif.. 더보기 [HTML] 링크와 네비게이션 태그 1. - 은 anchor의 약자 - 속성으로는 href를 사용하며, 형태는 href ="(원하는 URL) " - link로 설정할 경우 http나 https을 앞에 써줘야한다. (두 개의 차이점은 보안의 차이) 즉 절대경로를 다 써줘야한다. 2. - 은 navigation의 약자 - Aria Role로 특정요소에 역할정의, 읽는사람에게 정보 제공 가능 ->(예시 : -> 해석 : 이 네비게이션 역할을 하고 이 네비게이션은 메인 메뉴이다. 더보기 HTML 태그 기초2 1. , - 은 Unordered List의 약자 - 은 list item의 약자 - 은 리스트의 시작과 끝을 알려주는 역할은 한다. 2. - 은 Ordered List의 약자 - 순서를 부여한다. 3. , , - 은 Definition List의 약자 - 은 Definition Term의 약자 (단어) - 은 Definition Desciption의 약자 (단어의 설명) 4. - 은 Quote의 약자 - 인용문 5. , - time은 날짜, 시간을 나타낸다. - datatime은 time과 기능은 같지만, 기계가 잘 이해하기 위해 특정 형식을 쓴다. (YYYY-MM-DD) - datatime을 이용해 시간을 비교해 기능을 쓴다던지 활용가능 6. , , - code은 코드를 보여주고 싶을 때 사용한다. .. 더보기 HTML 태그 기초1 HTML은 tag를 이용하여 프로그래밍을 한다. tag를 여는부분과 닫은 부분으로 구분한다. Ex) This is a content -> 는 Opening Tag 는 Closing Tag -> This is a content는 태그 안에 들어가 있는 내용이 된다. -> This is a content 전체를 Element(원소)라 한다. 1. - paragraph의 약자 -문단을 구분해주는 역할을 한다. EX) 이 경우 문단을 구분해서 적었는데에도 불과하고 문단이 분리가 되지 않는 것을 볼 수있음. 이것을 해결하기 위해 를 이용한다. 와 를 이용함으로써 브라우저에게 여기가 문단의 시작이고 끝인 것을 알려준다. 2. ~ - Headlines의 약자 - 제목을 붙일 때 싸용 3. 와 - italics를 이용.. 더보기 웹의 구성요소 HTML, CSS, JAVASCRIPT HTML(HyperText Markup Language - 사이트의 구성요소를 정의한다. - 오류가 나도 오류난 부분을 짐작해서 수정후 알아서 실행시킨다. CSS(Cascading Style Sheetes) (cascade - 종속되다) - 사이트의 스타일링 담당한다. - 오류가 나면 일단 무시하고, 어떠한 형태로든 실행시킨다. JAVASCIPT - 상호작용을 담당 - 웹 프로그램 중에 다양한 기능을 사용가능하나, 오류가 날시 실행시키지 않는다. 웹 프로그램이 3가지 언어로 나뉘는 이유 - 기술의 변화에 대응력을 가질려고. 웹은 항상 호환이 되야 한다. 더보기 이전 1 다음