International support for HTML5 and css3

Source: Internet
Author: User

 

Reprinted please indicate the source: Jiang Yujie's blog (http://blog.csdn.net/hfahe)

HTML5 and css3 have made greater progress in solving cross-cultural and language problems with international support, which reflects the humanized design concept.

I. Padding-start and padding-end

The attributes padding-start and padding-end of css3 are used to solve the padding problem of Cross-language writing habits.

When the layout is from left to right, the padding-start is on the left and the padding-end is on the right. When the layout is on the right, the padding-start is on the right and the padding-end is on the left. This attribute can solve the compatibility problem of padding-right and padding-left in cross-writing habits.

One example is Chrome's new setting center:

Currently, the new versions of major browsers support the padding-start and padding-end labels as follows: both IE and opera are supported (ie, chrome, Firefox, opera, Safari, and QQ browser 5 from left to right ). For more details, refer to examples.

2. Box-pack

The new box model of css3 has a box-pack attribute, which can be set to four values: Start, end, center, and justify. The use of start and end is similar to that of padding-start and padding-end, because the box-direction attribute can set the sequence of box arrangement, and the use of start can be more universal and compatible, it is the starting position of the parent label.

Currently, the main browsers support the new box model of css3, which is similar to the padding-start label, except for IE and opera.

Iii.-WebKit-locale

A new attribute is added to the WebKit kernel:-WebKit-locale (previously called-WebKit-hyphenate-locale). The value can be set to auto or a string in a specified region, for example, "en_us ". This attribute, as its name implies, allows you to specify the display mode of a hyphen. This attribute is derived from bug 43467 in WebKit. On iOS 4.2 and later platforms, the effect is as follows:

However, this property is not like hyphenate-character, but is part of the css3 draft.

At present, it is obvious that it can only be used on WebKit kernel browsers, especially on iOS platforms:

Iv. Ruby labels

HTML5 provides Ruby labels that allow additional comments to one or more texts, such as the following code:

 <P> hello, <br/> <Ruby> <br/> <rb> HTML5 </rb> <br/> <rp> (</rp> <br/> <RT> Hyper Text mark-up language 5 </RT> <br/> <rp>) </rp> <br/> </Ruby> <br/> </P>

 The displayed text is as follows:

Ruby labels are useful in Chinese, Korean, and Japanese Textbooks and ancient texts. Readers can easily understand the detailed pronunciation and meaning of the text.

Currently, the new versions of major browsers support Ruby labels to the following levels: Except for parse refox and opera.

 

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.