谈 HTML5 和 CSS3 的国际化支持
分类: 前端 2011-03-31 23:27 4495 人阅读 评论(23) 收藏 举报
转载请标明出处:蒋宇捷的博客(blog.csdn.net/hfahe) HTML5、CSS3 在国际化支持,解决跨文化和语言问题上有了更大的进步,很 好的体现了人性化的
设计理念。 一、Padding-start、padding-end Padding-start、paddingCSS3 的属性 padding-start,padding-end,用于解决跨语言书写习惯的 padding
问题。 当排版是从左到右时,padding-start 在左边,padding-end 在右边;而排 版是右到左时,padding-start 在右边,padding-end 在左边。这个属性能够解 决 padding-right 和 padding-left 在跨书写习惯时的兼容性问题。
<!--[endif]--> 一个使用的例子是 Chrome 新的设置中心:
<!--[endif]-->
目前主要浏览器的新版本对于 Padding-start 和 Padding-End 标签的支持程 度如下:除 IE 和 Opera 外都支持(从左到右为 IE、Chrome、Firefox、Opera、 Safari、QQ 浏览器 5)。更多细节可以参考 https://developer.mozilla.org/en/CSS/-moz-padding-start 和 https://developer.mozilla.org/en/CSS/-moz-padding-end。
<!--[endif]--> 二、box-pack box- pack CSS3 新的盒子模型中有一个属性 box-pack,它可以设置为 4 个值:start、 end、center、justify。Start 和 end 的使用类似于 padding-start 和 padding-end,因为 box-direction 属性可以设置盒子排列的顺序,使用 start 可以更具普遍性和兼容性,就是指和父标签的起始位置对齐。 目前主要浏览器对于 CSS3 新盒子模型的支持情况类似于 padding-start 标 签:除 IE 和 Opera 外都支持。
<!--[endif]--> 三、-webkit-locale webkitWebkit 内核新增加了一个属性:-
webkit-locale(之前叫做 -webkit-hyphenate-locale,值可以设置为 auto 或者一个指定区域的字符串, 例如“en_us”。这个属性顾名思义,可以指定连字符的显示方式,此属性源于 Webkit 的 bug 43467。在 iOS 4.2 及以上版本平台上效果如下:
<!--[endif]--> 不过此属性还不像 hyphenate-character 一样,是 CSS3 草案中的一部分。 目前它很明显只能在 Webkit 内核浏览器上使用,尤其是在 iOS 平台上:
<!--[endif]--> 四、Ruby 标签
HTML5 提供了 Ruby 标签, 允许为一个或者多个文本添加附加注释,例如下 面的代码:
view plaincopy to clipboardprint?
1. 2. 3. 4. 5. 6. 7. 8.
Hello, HTML5
显示的文本如下:
Ruby 标签在中文、韩文和日文教科书和古文中非常有用,读者们可以方便 了解文本的详细读音和含义。 目前主要浏览器的新版本对于 Ruby 标签的支持程度如下:除 Fifrefox 和 Opera 外均提供支持。
<!--[endif]-->