代码

1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3
4 <head>
5 <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
6 <title>css 汉字注音，日本语片假名</title>
7 <meta name="description" content="涂聚文,缔友计算机信息技术有限公司,经营信息流,物流,人力资源流,资本流的系统解决方案的开发与设计和服务,geoVI studio.Geovin　Du. Systems Solution to Fund flow,and Information flow,and Material flow,and Control flow,and Human Resource.Applied software development,design and service。."/>
8 <meta name="description" content="Study,Communicate。 "/>
9 <meta name="Robots" content="all index follow "/>
10 <meta name="Author" content="涂聚文" />
11 <meta name="keywords" content="Chinea,Guangdong Province,Shenzhen city,Nanshan District,Hi-teach industry Park, geoVI studio,Geovin Du,Systems Solution.勝利は仕事部屋である貴方にご光来を賜ることを歓迎,the original affiliation, Jiangxi Province, the  Ji'an city, YongFeng coutry, Ouyang's hometown.  Discussion forum, friend reason person, English, Japanese language, Korean language...  The music appreciation, Wan Nian calendar, the English  salon, the trade market, the information, the telecommunication  electron, the electric appliance, the currency foreign exchange, the  news, the book, by talk, the fable, the fairy tale, the novel, the  sketch philosophy, the philosophy, the national studies, the poem, the word, the prose, the tune, manages the creativity, the software  technology, sound, the picture, the image data warehouse, C , C.NET,  WEB,JAVA, J2EE XML, the HTML, software engineering, the physiological,  keeping in good health, the traveling, lives,geocVi のスタジオはgeovindu, 中国のGuangdong の地域,Shenzhen のNanShan 地区すなわち高く新しい技術的な企業の開発の地帯すなわち元の加入すなわちJiangxi の地域すなわち Ji'an 都市, 故郷coutry YongFeng Ouyang's のへ, あなたを歓迎する。議論のフォーラムすなわち友人の理由人,  英語すなわち日本語の言語すなわち韓国語の言語は... 音楽感謝すなわちNian の弱々しいカレンダーすなわち英国の大広間すなわち貿易市場すなわち情報すなわちテレコミュニケーションの電子すなわち電気電気器具すなわち通貨の外国為替すなわちニュースすなわち本, 話によって, fable のおとぎ話すなわち小説すなわちスケッチの哲学すなわち哲学は, 国民調査する, 詩すなわち単語すなわち散文すなわち調子, 管理する創造性すなわちソフトウェア技術すなわち音すなわち映像すなわちイメージ・データの倉庫 , C , C.NET  の網, ジャワ, J2EE XML, html のよい健康すなわち移動, 生命で保つソフトウエア工学すなわち生理学を,®geoVI 일 방 ™고향 geocVi 스튜디오는 geovindu, 중국 의  Guangdong 지방, Shenzhen 의 NanShan 지역, 높은 새로운 기술 적인 공업 발달 지역, 원래 affiliation, Jiangxi 지방 , Ji'an 도시, coutry  YongFeng, Ouyang's에, 너를 환 영한다.  면담 공개토론, 친구 이유 사람, 영어, 일본 언어, 한 국 언어는...  음악 감사, Nian 병약한 달력, 영국 살롱, 무역  시장, 정보, 원거리 통신 전자, 전기기구, 통화 외국 교환, 뉴 스, 책, 이야기의옆에,fable 의 요전같은 총계, 소설, 밑그림  철학,  철학은, 동포 공부한다, 시, 낱말, 산문, 곡,  처리한다  독창성, 소프트웨어 기술, 소리, 그림,심상 자료 창고 , C , C.NET 의 웨브, 자바, J2EE  XML, HTML 의 건강, 여행,  일생안에 지키는 소프트웨어 기술설계, 생리를">
12         <link rel="stylesheet" href="css/style.css" type="text/css"/>
13         <link rel="stylesheet" href="css/shadow.css" type="text/css"/>
14 <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
15 <link rel="icon" href="favicon.ico" type="image/ico" />
16 <link rel="bookmark" href="favicon.ico"/>
17
18 <style type="text/css">
19
20
21
22
23 </style>
24
25 </head>
26
27 <body>
28 <ruby>中国人民万万岁<rt>zhōng guó rén mín wàn wàn suì </rt><br/>
29 缔友计算机信息技术有限公司,締友計算機信息技術有限公司<rt>dì yǒu jì suàn jī xìn xī jì shù yǒu xiàn gōng sī ,dì yǒu jì suàn jī xìn xī jì shù yǒu xiàn gōng</rt>
30 </ruby>
31 <ruby>
32 <rbc><rb>林</rb> <rb>和</rb> <rb>代</rb></rbc>
33 <rtc> <rt>はやし</rt><rt>かず</rt><rt>よ</rt> </rtc>
34 </ruby>
35 <ruby>
36 <rbc><rb>民政局</rb></rbc>
37 <rtc><rt>みんせいきょく</rt></rtc>
38 <rtc><rt>ガバメント・セクシヨン</rt></rtc>
39 </ruby>
40 <ruby style=”ruby-align: right; ruby-position: above; ruby-overhang: whitespace”>Ruby base content<rt>Ruby text</rt></ruby>
41     <ruby>
42     <span style="font-family:Verdana; font-size:14pt">This is the base text.</span>
43     <rt>
44     <span style="font-family:Times New Roman; font-size: 8pt; color:red">
45     This is the ruby text</span>
46     </ruby>
47
48     <ruby>
49   <rbc>
50     <rb>10</rb>
51     <rb>31</rb>
52     <rb>2002</rb>
53   </rbc>
54   <rtc>
55     <rt>Month</rt>
56     <rt>Day</rt>
57     <rt>Year</rt>
58   </rtc>
59   <rtc>
60     <rt rbspan="3">Expiration Date</rt>
61   </rtc>
62 </ruby><ruby><rb>你</rb><rp>(</rp><rt>nǐ</rt><rp>)</rp></ruby>
63 <ruby><rb>我</rb><rp>(</rp><rt>wǒ</rt><rp>)</rp></ruby>
64 <br/>
65 参考网址：
66 http://www.w3.org/International/articles/ruby/#Slide0140
67 http://www.w3.org/International/tutorials/ruby/en/all.html
68 http://www.css3.com/css-ruby-align/
69 http://www.css3.com/css-ruby-overhang/comment-page-1/#comment-15977
70 http://www.w3.org/TR/css3-ruby/
71 http://htmlruby.codeplex.com/
72
73  firefox浏览器下载附件：HTML Ruby或是 XHTML Ruby Support
74 </body>
75
76 </html>
77

实例效果：http://geovindu.blog.163.com/blog/static/9827808201002485624350/

摘于《中国历代咏月诗词全集》河南文艺出版社邓国光曲奉先编

秋风清李白(qiū fēng qīng lǐ bái)

秋风清，秋月明。落叶聚还散，寒鸦栖复惊。相思相见知何日，此时此夜难为情(qiū fēng qīng ，qiū yuè míng 。luò yè jù hái sàn ，hán yā qī fù jīng 。xiàng sī xiàng jiàn zhī hé rì ，cǐ shí cǐ yè nán wéi qíng 。)

虞美人李煜( yú měi rén lǐ yù )

春花秋月何时了，往事知多少。小楼昨夜又东风，故国不堪回首月明中。( chūn huā qiū yuè hé shí le ，wǎng shì zhī duō shǎo 。xiǎo lóu zuó yè yòu dōng fēng ，gù guó bú kān huí shǒu yuè míng zhōng 。)

雕阑玉砌应犹在，只是朱颜改。问君能有几多愁，恰似一江春水向东流。( diāo lán yù qì yīng yóu zài ，zhī shì zhū yán gǎi 。wèn jun1 néng yǒu jǐ duō chóu ，qià sì yī jiāng chūn shuǐ xiàng dōng liú 。)

乌夜啼李煜( wū yè tí lǐ yù )

无言独上西楼，月如钩。寂寞梧桐深院、锁深秋。( wú yán dú shàng xī lóu ，yuè rú gōu 。jì mò wú tóng shēn yuàn 、suǒ shēn qiū 。)

剪不断，理还乱，是离愁。别是一般滋味、在心头。( jiǎn bú duàn ，lǐ hái luàn ，shì lí chóu 。bié shì yī bān zī wèi 、zài xīn tóu 。)

虞美人晏几道( yú měi rén yàn jǐ dào )

曲阑干外天如水，昨夜还曾倚。初将明月比佳期。长向月圆时候、望人归( qǔ lán gàn wài tiān rú shuǐ ，zuó yè hái céng yǐ 。chū jiāng míng yuè bǐ jiā qī 。zhǎng xiàng yuè yuán shí hòu 、wàng rén guī)

罗衣著破前香在，旧意谁教改。一春离恨懒调弦。犹有两行闲泪、宝筝前。( luó yī zhe pò qián xiāng zài ，jiù yì shuí jiāo gǎi 。yī chūn lí hèn lǎn diào xián 。yóu yǒu liǎng háng xián lèi 、bǎo zhēng qián 。)

前调晏几道( qián diào yàn jǐ dào )

当时月下分处，依旧凄凉。也会思量。不道孤眠夜更长。( dāng shí yuè xià fèn chù ，yī jiù qī liáng 。yě huì sī liàng 。bú dào gū mián yè gèng zhǎng 。)

泪痕搵遍鸳鸯枕，重绕回廊。月上东窗。长到如今欲断肠。( lèi hén wèn biàn yuān yāng zhěn ，zhòng rào huí láng 。yuè shàng dōng chuāng 。zhǎng dào rú jīn yù duàn cháng 。)

阳关曲苏轼( yáng guān qǔ sū shì)

暮云收尽溢清寒，银汉无声转玉盘。此生此夜不长好，明月明年何处看。( mù yún shōu jìn yì qīng hán ，yín hàn wú shēng zhuǎn yù pán 。cǐ shēng cǐ yè bú zhǎng hǎo ，míng yuè míng nián hé chù kàn 。)

减字木兰花春月苏轼( jiǎn zì mù lán huā chūn yuè sū shì)

春庭月午，摇荡香醪光欲舞。步转回首廊，半落梅花婉娩香。( chūn tíng yuè wǔ ，yáo dàng xiāng láo guāng yù wǔ 。bù zhuǎn huí shǒu láng ，bàn luò méi huā wǎn miǎn xiāng 。)

轻云薄雾，总是少年行乐处。不似秋光，只与离人照断肠。( qīng yún báo wù ，zǒng shì shǎo nián háng lè chù 。bú sì qiū guāng ，zhī yǔ lí rén zhào duàn cháng 。)

虞美人苏轼( yú měi rén sū shì)

持杯遥劝天边月：愿月圆无缺。持杯复更劝花枝：愿花枝长在、莫离披。( chí bēi yáo quàn tiān biān yuè ：yuàn yuè yuán wú quē 。chí bēi fù gèng quàn huā zhī ：yuàn huā zhī zhǎng zài 、mò lí pī 。)

持杯月下花前醉，休问荣枯事。此欢能有几人知？对酒逢花不饮、待何时。( chí bēi yuè xià huā qián zuì ，xiū wèn róng kū shì 。cǐ huān néng yǒu jǐ rén zhī ？duì jiǔ féng huā bú yǐn 、dài hé shí 。)

水调歌头丙辰中秋，欢饮达旦，大醉，作此篇，兼怀子由苏轼( shuǐ diào gē tóu bǐng chén zhōng qiū ，huān yǐn dá dàn ，dà zuì ，zuò cǐ piān ，jiān huái zǐ yóu sū shì )

明月几时有，把酒问青天。不知天上宫阙，今夕是何年。( míng yuè jǐ shí yǒu ，bǎ jiǔ wèn qīng tiān 。bú zhī tiān shàng gōng què ，jīn xī shì hé nián 。)

我欲乘风归去，又恐琼楼玉宇，高处不胜寒。起舞弄清影，何似在人间。 (wǒ yù chéng fēng guī qù ，yòu kǒng qióng lóu yù yǔ ，gāo chù bú shèng hán 。qǐ wǔ nòng qīng yǐng ，hé sì zài rén jiān 。 )

转朱阁，低绮户，照无眠。不应有恨，何事长向别时圆？( zhuǎn zhū gé ，dī qǐ hù ，zhào wú mián 。bú yīng yǒu hèn ，hé shì zhǎng xiàng bié shí yuán ？)

人有悲欢离合，月有阴晴圆缺，此事古难全。但愿人长久，千里共婵娟。 (rén yǒu bēi huān lí hé ，yuè yǒu yīn qíng yuán quē ，cǐ shì gǔ nán quán 。dàn yuàn rén zhǎng jiǔ ，qiān lǐ gòng chán juān 。 )

菩萨蛮新月苏轼( pú sà mán xīn yuè sū shì)

画檐初挂弯弯月，孤光未满先忧缺。遥认玉帘钩，天孙梳洗楼。( huà yán chū guà wān wān yuè ，gū guāng wèi mǎn xiān yōu quē 。yáo rèn yù lián gōu ，tiān sūn shū xǐ lóu 。)

佳人言语好，不愿新巧。此恨固应知，愿人无别离。 (jiā rén yán yǔ hǎo ，bú yuàn xīn qiǎo 。cǐ hèn gù yīng zhī ，yuàn rén wú bié lí 。 )

Firefox浏览器没有注音效果，请添加附件：HTML Ruby或是 XHTML Ruby Support

看不清拼音可以：按住Ctrl键，转动鼠标中间滑动键，它会自动变大缩小字体，

每个浏览器基本都有这个快捷键。

charts for tonal pinyin in Unicode Web pages

ā ā

á á

ǎ ǎ

à à

ē ē

é é

ě ě

è è

ī ī

í í

ǐ ǐ

ì ì

ō ō

ó ó

ǒ ǒ

ò ò

ū ū

ú ú

ǔ ǔ

ù ù

ǖ ǖ

ǘ ǘ

ǚ ǚ

ǜ ǜ

更多专业前端知识，请上【猿2048】www.mk2048.com

css 汉字注音，日本语片假名相关推荐

标准日本语学习（初上）第一课
生词学习(熟悉五十音图和日语打字) 单词来源<标准日本语> ちゅうごくじん(chu u go ku ji n) 中国人备注:chu 拗音,chu u长音 ,go 浊音,浊音, ...
新版标准日本语中级_第二十课
语法 1. か的省略:疑问句的句尾有时会出现省略助词か的现象,此时句尾读升调.句尾是~です时很少省略,但是~ます时则经常省略.省略か会给人略显亲切的感觉. コーヒー飲みます?(来杯咖啡吗?) ...
《标准日本语》初级单词汇总
<标准日本语> 初级上册第1课词汇Ⅰ わたし (0) [代] 我会社員 (かいしゃいん) (3) [名] 公司职员学生 (がくせい) (0) [名] 学生 (多指高等院校的 ...
新版标准日本语中级_第二十一课
语法 1. ~なさいませんか:邀请或劝诱的表达,在汉语中一般使用肯定的形式,但日语多采用三类动词~しませんか的形式来表达.进一步表示礼貌时,使用する的尊他语なさる,变成~なさいませんか. 此外 ...
新版标准日本语高级_第24课
文章目录语法单词语法 1. 使役形式与やりもらい相结合的表达方式使役形式 + てください.使役形式 + てもらう/ていただく + ていいですか/てよろしいですか的形式表示有礼貌地向对方 ...
日本语能力测试考点地址及联系方式
考点信息日本语能力测试考点地址及联系方式地区代号考点名称考场地址电话邮编北京 1020101 北京外国语大学考试中心海淀区西三环北路19号 010-88817840 10 ...
日本语达人之道第二章
<日本语达人之道>第二章 PS:果然呀,那个偶还是决定把它也打出来了打动人心的说话技巧 --有了它,事事春风得意在日常生活中,我们会遇到许多场面,每一个场面都有着不同的感触,本来想这样说, ...
日本语能力测试官方试题集
日本语能力测试官方试题集_N1 链接:https://pan.baidu.com/s/1Rhww9WetxfqbmNbMmuCsQQ 提取码:uio1 日本语能力测试官方试题集_N2 链接 ...
【日语】标准日本语动词大全
标准日本语动词大全くださる (3) [动1] 请给 (我) いただく (0) [动1] 收下起きる (おきる) (2) [动2] 起床始まる (はじまる) (0) [动1] 开始終わる ...

css 汉字注音，日本语片假名

charts for tonal pinyin in Unicode Web pages

css 汉字注音，日本语片假名相关推荐

最新文章

热门文章