웹표준/Semantics(의미론) (7) 썸네일형 리스트형 7. HTML5 Parser Gecko에서는 최근 HTML5 기반의 새로운 파서(parser)를 도입했다. 이는 기존 파서보다 더 빠르고 html5 표준을 준수하며 많은 기능들이 추가되었다. 새로운 파서는 아래와 같은 사항이 개선되었다. SVG, MathML을 XML 네임스페이스 없이 HTML5페이지 내에서 inline형식으로 사용 가능하게 되었다. 파이어 폭스의 UI스레드와 독립적으로 작용하기 떄문에 브라우저의 반응성이 향상되었다. innerHTML 형식이 빠르다,,? 오래전부터 있었던 수십개의 버그사항이 수정되었다. html5 스펙은 이전의 html표준보다 더욱 상세한 설명을 제공하여, Gecko, WebKit, IE에서 보다 일관적으로 작동된다. 변경된 새로운 파서 - 태그 내의 좌측 꺽쇠 괄호를 토큰화 한다. 쉽게말해서 잘 .. 6. 수학적 수식을 나타내기위한 MathML MathML(수학 마크업 언어)이란 수학적 표기법을 설명하고 그 구조와 내용을 모두 파악하기위한 XML형식의 마크업 언어이다. 이는 웹 페이지 및 다른 문서들에 수식을 통합하는 것을 목적으로 한다. *단, mathml.css파일을 임폴트한 상태에서 적용이 되는듯하다 MathML 요소 요소 기능 math 수식 전체를 감싸는 그룹 mrow 표현식 전체를 그룹화하는데 사용 msup 지수함수를 표현할때 사용. 첫번째 요소가 정수 두번째 요소가 지수가 된다. mi 변수, 함수, 상수를 나타낼때 사용 mn 숫자를 나타낼 때 사용 mo +, -, * 등과 같은 연산자에 사용 msqrt 루트 함수를 나타낼때 사용 mfrac 분수 함수를 나타낼때 사용. 첫번째 요소는 분자 두번째 요소는 분수가 된다. 예제1. 제곱근 예.. 5. 표준화된 <iframe> 속성 - allow : 기능의 정책을 지정함. 보안,정보 관련 - allowfullscreen : 전체화면모드를 활성화 (allow="fullscreen") - allowpaymentrequest : 금액 지불 API호출 (allow="payment") - csp : 컨텐츠 보안 정책 - height : 프레임의 높이값. 기본값은 150 - importance : src속성에서 리소스의 다운로드 순위를 결정. auto : 비추. high : 우선순위가 낮은 소스 먼저 다운. low : 우선순위가 높은 소스 먼저 다운. - loading : 브라우저가 iframe을 로드하는 방법 eager : 뷰포트의 위치와 관계없이 즉시 로드. lazy : 뷰포트가 iframe의 위치에 도달 할 때까지 로딩을 연기함. .. 4. HTML5 태그 정리 메인루트 문서 메타 데이터 구획 루트 콘텐츠 구획 텍스트 콘텐츠 인라인 텍스트 이미지&미디어 내장콘텐츠 스크립트 수정사항 표시 테이블 콘텐츠 폼 요소 대화형 요소 아래 pdf파일은 HTML5 태그들을 정리해놓은 치트시트이다. 영어가 어느정도 된다면 참고해보길 바란다. HTML5와 HTML4버전에서 각각 지원되는 태그들을 비교해보고싶다면 아래 링크에서 확인해보길 바란다. https://www.wpkube.com/html5-cheat-sheet/ 3. HTML 폼태그 HTML폼은 사용자와 서버가 상호작용을 할 수 있게 해주는 요소이다. HTML요소 : 클릭 할 수 있는 버튼요소 : 옵션요소의 집합을 포함 : 폼 안에 여러 폼요소들을 그룹화 할 때 사용 : 사용자가 정보를 웹서버로 전송하도록 상호작용하는 요소를 포함 : 대화형 컨트롤 폼 : 폼 요소의 일부로, 키 데이터를 발생시키고 공개키를 전송 : UI항목에 대한 캡션 : fieldset요소를 위한 캡션 : 범위안의 스칼라 값..? 범위값을 나타냄 : select 내부의 옵션그룹 : select, optgroup, datalist안에서 사용되며 항목을 : 계산 결과를 반환 : 작업의 진행상태를 나타냄 : 옵션 메뉴를 제공하는 컨트롤 : 다중라인 텍스트 편집컨트롤 HTML 속성 2. HTML5 비디오/오디오 요소 2000년대 초에는 웹에 비디오와 오디오를 포함할 수 없었기 때문에, Flash와 같은 플러그인 기반의 기술로 처리했다. 하지만 HTML5사양에서는 요소를 이용하여 영상 및 사운드를 제공가능하다. 요소 src : 동영상의 경로. controls : 사용자에게 비디오 및 오디오 재생을 제어 할 수 있도록 컨트롤러를 제공. 태그 안의 단락 : 해당 비디오를 지원하지않는 환경에서 제공될 대체 콘텐츠. 다양한 소스포맷을 사용해 호환성 향상 - 컨테이너형식 : MP3, MP4, WebM과 같이 메타 데이터 + 코덱 + 오디오/비디오 트랙이 저장된 구조 컨테이너 비디오 오디오 호환성 WebM VP8 / VP9 Vorbis / Opus 최신 브라우저 대부분 지원 MP4 H.264 AAC / MP3 모든 브라우저에서 .. 1. HTML5의 개요 HTML5 개요 - 문서에 html5마크업이 포함되었음을 알리는 구문 - doctype을 선언함과 동시에 HTML5를 지원하지않는 브라우저도 표준모드로 전환된다. - 페이지에서 일반적으로 사용되는 문자셋을 내부에 선언 - ASCII와 호환되며, 최소 8비트 이상을 사용하는 문자셋으로 제한. 새로운 파서의 사용 - 마크업에 작은 오류가 발생하면 브라우저 환경에 따라 동작이 정의되지 않았던 과거와 달리, 모든 호환 브라우저가 동일한 방식으로 작동. 파싱(parsing) : 특정문서를 읽어 들여서 다른 방식의 표현식으로 변환시켜주는 행위. 예를들어 html태그를 시각적 화면으로 분할하는 행위 파서(parser) : 파서는 파싱을 하는 프로세서를 일컫는다. 컴파일러와 인터프리터가 이에 해당된다. HTML5에 추.. 이전 1 다음
