ChainSmoker’s Block
[시맨틱 웹을 위한 태그] 2_2-4. 시맨틱 웹에서의 현재 진행 중인 상태 표현에 이어 설명. [02. 표현을 위한 요소] : -> progress 요소를 사용하여 최소값 0, 최대값 100의 Progress바를 생성하고 현재 수치로 72를 지정.
[02. 표현을 위한 요소] : 많은 파일을 복사 붙여넣기 하거나 파일 다운로드를 웹브라우저 내에서 할 때 작업 진행 상태를 확인 가능하다. progress 요소는 바로 어떠한 작업에 대하여 현재 진행 중인 상태를 나타낼 때 사용하는 요소이다. 단순히 progress 요소만을 사용한다면 멈춰져 있는 단순한 진행 상태 바를 확인할 수 있을 것이다. 그러므로 progress 요소는 필수적으로 자바스크립트(JS)와 연동해 사용해야 한다. value : 현재 진행 상태 값 min : 최소값 max : 최대값
[시맨틱 웹을 위한 태그] 2_2-3. 시맨틱 웹에서의 범위나 비율 표현에 이어 설명. [02. 표현을 위한 요소] : 9 : meter 요소를 사용하여 디스크 사용률에 대하여 최소값(min) 0, 최대값(max) 100, 유효한 최소값(low) 10, 유효한 최대값(high) 90으로 지정한다. 그리고 실제 사용률(value) 값으로 95를 지정한다. 10 : meter 요소를 사용하여 지역 투표율에 대하여 최소값(min) 0, 최대값(max) 100, 기대치 값 60을 지정한다. 그리고 실제 투표율(value) 값으로 47을 지정한다.
[02. 표현을 위한 요소] : meter 요소는 일정 범위 안의 값이나 분포 비율 등을 나타낼 때 사용한다. 예를 들자면 현재 디스크 사용률이나, 성적 비율 등을 나타낼 때 사용할 수 있다. 범위와 값을 표현하기 위하여 meter는 아래와 같은 속성을 가지고 있다. 0 value : 실제로 측정한 데이터 지정 0 min : meter 요소가 인식하는 최소값 지정 0 max : meter 요소가 인식하는 최대값 지정 0 low : 허용되는 범위의 최소값 지정 0 high : 허용되는 범위의 최대값 지정 0 optimum : 기대치 값 지정 0 title : 툴팁 입력 value, low, high 속성의 값을 지정할 때 주의해야 할 점은 반드시 min 속성의 값과 max 속성의 값 사이의 값이어야 한다는..
[시맨틱 웹을 위한 태그] 2_2-2. 시맨틱 웹에서의 시간 표현에 이어 설명. [02. 표현을 위한 요소] :
[02. 표현을 위한 요소] : time 요소를 사용하여 시간 표현에 대해서 의미를 부여할 수 있다. 예를 들자면 단순히 '2023_01_01'이라고 표기를 하게 되면 시각적으로는 날짜라고 정확하게 알 수 있지만 시스템에서는 그냥 일반적 텍스트인지, 날짜인지를 구분하기 힘들다. 그러므로 날짜나 시간 등에 대해서 time 요소를 사용하여 의미를 부여하는 것이 좋다. time 요소에는 datetime이라는 속성이 존재하는데 이 속성에 정확한 형식의 시간이나 날짜를 지정하여 시스템이 지정한 시간이나 날짜를 인식할 수 있게 할 수 있다. 속성(datetime = 시간(time) 또는 날짜(date)) 설명(시간(time) 또는 날짜(date) 지정)
[시맨틱 웹을 위한 태그] 2_2-1. 시맨틱 웹에서의 특정 텍스트 강조 표현에 이어 설명. [02. 표현을 위한 요소] : mark 요소는 모든 브라우저에서 지원되고 있다. 지원이 중단된 익스플로러든, 지원중인 파이어폭스, 크롬, 사파리, 오페라 등등이다.
[02. 표현을 위한 요소] : HTML4에서는 강조하고자 하는 문구나 단어에 strong요소를 주로 사용해 왔다. HTML5에서는 이에 추가로 mark 요소를 사용할 수 있다. 하지만 만약 시각적으로 강조하고자 하는 용도로 사용한다면 기존의 string 요소만으로도 충분할 것이다. 하지만 의미적으로도 강조하고자 한다면 mark요소를 사용해야 한다. mark 요소만을 사용한다면 노란색 형광펜으로 표시될 것이다. 하지만 만약 다른 색깔이나 효과를 주고싶다면 CSS를 함께 사용하면된다.
[02. 표현을 위한 요소] : HTML5에는 시맨틱 웹을 위해 레이아웃을 위한 요소뿐 아니라 표현을 위한 요소도 추가되었다. 표현을 위한 요소라 하면, 시각적인 효과를 위한 요소, 시간을 표현하는 요소, 일정 범위 안의 값을 표현하는 요소 등이 있다. mart요소 : 특정 텍스트를 강조하고자 할 때 사용하는 요소 time요소 : 시간 표현에 의미를 주고자 할 때 사용하는 요소 meter요소 : 일정 범위 안의 값이나 분포 비율 등을 나타낼 때 사용하는 요소 progress요소 : 어떠한 작업에 대하여 현재 진행중인 상태를 나타낼 때 사용하는 요소
[01. 레이아웃을 위한 요소] [시맨틱 웹] 2_1-3. 내비게이션 메뉴(nav)와 사이드바(side_b)_2에 이어 설명. [1-3 내비게이션 메뉴(nav)와 사이드바(side_b)] : header 요소를 사용하여 헤더 영역을 지정. 두 개의 제목을 표기하기 위하여 hgroup 요소를 사용하여 하느의 그룹으로 묶는다. nav 요소를 사용하여 내비게이션 메뉴를 넣을 영역을 지정. ection 요소를 사용하여 콘텐츠를 넣을 영역을 지정. header 요소를 사용하여 section 요소 내부에 헤더 영역을 지정. article 요소를 사용하여 각각 독립적인 콘텐츠를 넣음. aside 요소를 사용하여 부가적으로 넣을 콘텐츠 영역을 지정. footer 요소를 사용하여 저작권 정보 등을 넣을 푸터 영역을 지정.