1. 루비 주석
루비는 이전부터 있었음. 익스플로러에서 쓰던 표현요소. html5에서 정식. 모든 브라우저에서 쓸 수 있다. 파이어폭스에서는 잘 표현이 안되다가 요즘은 잘 됨.
1) 루비 : 글자 위에 장식, 설명을 쓸 때. 일본어 영어의 경우는 보이는 글자 위에 설명을 붙여서 표현 가능. 한자 표시시에 좋음.
- rt로만 표현이 안될 경우에는 rp를 써서 괄호 표시를 해준다.
가화만사성 (家和萬事成)
- 한글자씩 맞춰주는 것도 좋다.
: 일본어의 경우는 한자 하나에 글자 2개씩 설명이 올라가는 경우도 있기 때문에 글자 하나씩 표현하는 바업도 알아준다.
- 점을 찍어서 글자 한글자씩 강조를 한다.
2. 시간 표현
마우스를 올려도 나오지는않으나, 컴퓨터가 명확하게 확인할 수 있다.
2019년 4월 9일이라고 쓰면 외국인은 알 수 없으니, datetime을 써서 정확한 날짜를 적는다.
2018-04-08로 표현 T09:20 시분을 표시
------------------------------------------------
http://html5.clearboth.org/text-level-semantics.html#the-ruby-element
크롬, 익스플로러에서 확인, 파이어폭스는 지원되지 않음.
------------------------------------------------
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>ruby | inline element</title>
<style>
body{
font: 12px '돋움',sans-serif;
}
ruby{
font-family: '바탕',serif;
}
rt, rp{
font-family: '돋움',sans-serif;
font-weight: normal;
}
</style>
</head>
<body>
<!-- ruby 요소는 하나 이상의 구문 컨텐츠의 일부분에 루비 주석을 달기 위해 사용합니다. 루비 주석은 베이스 텍스트 주변에 나타나는 짧은 텍스트이며 주로 동아시아권 언어에서 발음이나 기타 주석 목적으로 사용됩니다. 일본어에서 이것은 furigana라고 알려진 타이포그래피를 형성합니다. -->
<h1>
<ruby>
家 <rp>(</rp><rt>가</rt><rp>)</rp>
和 <rp>(</rp><rt>화</rt><rp>)</rp>
萬 <rp>(</rp><rt>만</rt><rp>)</rp>
事 <rp>(</rp><rt>사</rt><rp>)</rp>
成 <rp>(</rp><rt>성</rt><rp>)</rp>
</ruby>
</h1>
<hr>
<h1>
<ruby>
家和萬事成
<rp>(</rp><rt>가화만사성</rt><rp>)</rp>
</ruby>
</h1>
</body>
</html>
------------------------------------------------
http://html5.clearboth.org/text-level-semantics.html#the-time-element
------------------------------------------------
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>time | inline element</title>
</head>
<body>
<h1>time element</h1>
<!-- time 요소는 24시간에서의 시간, 혹은 그레고리력에서의 정밀한 날짜 - 선택적으로, 타임존 옵셋 정보를 포함하여 - 를 나타냅니다. -->
<p>나는 아침 <time datetime="09:00">9시</time>에 아침을 먹습니다.</p>
<p>나는 아침 <time>09:00</time>에 아침을 먹습니다.</p>
<p><time datetime="2014-11-07">오늘</time>은 입동입니다.</p>
<!--
2014 년
2014-11 년 월
2014-11-07 년 월 일
2014-11-07T09:00 년 월 일 시 분
2014-11-07T09:00:00 년 월 일 시 분 초
2014-11-07T09:00:00.000 년 월 일 시 분 초 밀리초
2014-11-07T09:00+09:00 세계표준시 적용(UTC)
-->
</body>
</html>
'Front > Html' 카테고리의 다른 글
[HTML] 3-8. a태그 (0) | 2020.11.05 |
---|---|
[HTML] 3-7. 테이블 작성하기. table,tr,th,td (0) | 2020.11.05 |
[HTML] 3-6. 목록 작성하기 (0) | 2020.11.05 |
[HTML ]3-5. 제목, 문단, 연락처, 인용문 목록 작성하기 (0) | 2020.11.05 |
[HTML] 3-3. 단의어 정의와 약어, 작품의 제목 표현. (0) | 2020.11.05 |
[HTML] 3-2. 구문강조, 하이라이팅 (0) | 2020.11.05 |
[HTML] 3-1. 문자 실체잠조와 수치 문자 참조 적용 (0) | 2020.11.05 |
[HTML] 2-4. html템플릿 작성하기 (0) | 2020.11.05 |