반응형 IT/Web105 HTML5 - 멀티미디어 태그 HTML5에서 새롭게 추가된 멀티미디어 태그에 대해. video, audio, embed (플러그인 다운로드) ActiveX, 각종 플러그인을 설치하여 불편함과 보안 위협에 노출되어 있습니다. HTML5에선 이런 문제를 해결하기 위해 브라우저 자체에서 동영상을 감상하고 음악을 들을 수 있게 각종 미디어 태그가 추가되었습니다. VIDEO 지원 IE Crome Firefox Opera Safari mp4 IE9이상 지원 지원 미지원 미지원 지원 ogg 미지원 지원 지원 지원 미지원 webM 미지원 지원 지원 지원 미지원 사용법 브라우저가 요소를 만나면 에 지정된 비디오 파일과 오디오 파일이 담긴 컨테이너들을 읽어들여 재생할 수 있는 첫 번째 파일을 재생한다. 이는 source에 지정된 type 속성을 통해 .. IT/Web 2019. 7. 8. 더보기 ›› HTML5 - 태그 설명 기본 구조부터 시작해서 여러가지 태그들을 알아봅니다. HTML5의 DOCTYPE (문서타입) 문자 인코딩 // 마크업 문서의 문자 인코딩을 명시할때 사용한다. 문자 인코딩 단순화 딱히 명시하지 않아도 브라우저는 스크립트가 웹에서 가장 인기있는 스크립트 언어인 자바스크립트로 작성되었을 것을 알기에 생략해도 된다(type="text/javascript"). css 파일링크 또한 type="text/css"를 매번 명시하지 않아도 된다. 아래는 위에서 배운 구조들을 종합한 것 사라진 태그 표현을 위해 필요했던 태그들이 대부분 사라졌다. , , , 등과 같이 CSS로 대체할 수 있는 태그들은 HTML5에서 제외되었고, 와 는 의미가 재정의 되었다. 태그 설명 영문 축약형 사용시 예를 들어 NATO,NASA등 이.. IT/Web 2019. 7. 8. 더보기 ›› HTML5 - 시작 및 HTML5 표준 코딩 규칙 HTML Hyper Text Mark-up Language를 다뤄볼게요. 초보자도 눈치만 있으면 쉽게 파악할 수 있는 내용까지는 자세히 안다룰꺼예요. 적당히 필요한 내용만 언급하겠습니다. 무료 소프트웨어인 Atom Editor를 사용할꺼예요. (물론 편하신 에디터를 사용하셔도 되요. NotePad++ 등..) 에디터 사용에 대한 자세한 설치 및 패키지 등은 아래 글을 참고하세요. 아톰 에디터 설치 및 설정 글 아톰(Atom) 에디터 설치 및 설정 아톰(Atom) 에디터 요즘 대세인 에디터이다. 아톰(Atom) 설치 1. https://atom.io 접속 후 다운로드 버튼 클릭, 설치 파일 실행하면 된다. 너무 쉽다. 누를 것도 없다. 운영체제도 알아서 선택된다. 고민하지말고.. yjshin.tistory.. IT/Web 2019. 7. 8. 더보기 ›› 아톰 편집 프로그램 Atom 패키지 Atom? 아톰은 text editor이다. 패키지 추천 aligner key - value 정렬을 해준다. atom-beautify 코드를 예쁘게 정렬해준다. 지원언어가 엄청 많으며, 각 언어별로 커스터마이징도 할 수 있다. atom-html-preview Ctrl+Shift+H -> 코딩의 현재 상태를 바로 확인할 수 있는 창 atom-ternjs javascript 자동완성기능을 제공하는데, ES6, Node.js, jQuery, AngularJS 문법까지 지원한다. auto-detect-indentation 아톰은 setting -> packages -> [language XXX] 에서 각 언어별로 탭사이즈를 지정할 수 있는데, 거기서 지정한 탭사이즈가 곧 Tab키를 눌렀을 때 몇 칸을 띄울건지를.. IT/Web 2019. 7. 5. 더보기 ›› 아톰 에디터 설치 및 설정 아톰(Atom) 에디터 요즘 대세인 에디터이다. 아톰(Atom) 설치 1. https://atom.io 접속 후 다운로드 버튼 클릭, 설치 파일 실행하면 된다. 너무 쉽다. 누를 것도 없다. 운영체제도 알아서 선택된다. 고민하지말고 Download 버튼을 클릭하자. 2. 설치 진행 모습 3. 설치 완료 모습 Register as default atom:// URI handler? 란 질문엔 Yes를 선택하자. 별거 아니다. 오른쪽 사이드 바에 각종 설정 관련 정보들이 존재한다. 필요한 내용을 선택해서 적용하면 된다. 4. 예를 들어 패키지를 설치 하고 싶다면 Install a Package를 클릭하고 패키지명을 검색 후 Install 버튼을 누르면 된다. 5. 유용한 패키지 설명은 다음 글에서 다루겠다... IT/Web 2019. 7. 5. 더보기 ›› 반응형 이전 1 ··· 18 19 20 21 다음