Shulou(Shulou.com)06/03 Report--

This article mainly introduces how to solve the problem of mixed row height in Chinese and English in web page design, which has a certain reference value. Interested friends can refer to it. I hope you will gain a lot after reading this article. Let the editor take you to know it.

Basically driven crazy by this problem, the symptoms are as follows

Description of symptoms: under ie (6 or 7Power8 has not been tried), when there is a mixture of Chinese and English, using the default font, and using the li list to do float, there will be symptoms such as the above picture, the text arrangement is not aligned up and down. It affects the aesthetics of the layout. The reason for the above picture is that the Chinese and English text baselines are different. The lower edge of the arial font is one pixel lower than that of the Song typeface (both 12), and the upper edge is two pixels shorter than the Song typeface. Therefore, when the Chinese and English mixed arrangements are aligned, there will be obvious height differences, resulting in uneven typesetting. You can see the enlarged image.

Adopt the scheme of using Song style in both Chinese and English characters.

It can solve the situation that the text arrangement is not aligned, but the Song style English character is a serif font (Times New Roman is the serif character in English), the font is compact, there are many details, and the arrangement is very eye-catching, but when it is written continuously, it is easy to make it difficult to identify and read the wrong lines. See this article about the advantages and disadvantages of serif fonts. In contrast, it is more beautiful and generous to use sans-serif typefaces in English.

The solution is the discovery of "dumplings" children's shoes.

Tahoma fonts are used in English-Song typeface, arial and tahoma fonts are compared-arial and tahoma are more refined in sans serif.

When mixing Chinese and English, the use of tahoma font

In the mixed arrangement of Chinese and English, the line heights of the pure Chinese combinations are the same, but the underline an is glued to the Chinese language in the state of hover.

Defect: when using tahoma fonts, the underline of all Chinese font links will be adhered to the font when using ie6 and below ie6. Taobao also uses this solution. It is believed that in large-scale projects, when different people work together to complete the module of a page, under a unified specification, the font will be more standardized and less misplaced, and it is worthwhile to adopt tahoma fonts with underscores that will appear to adhere to the font.

The following is found with rice children's shoes:

Arial font is used in English and Song style is used in Chinese. Line-height:1.231 can be marked in the label to solve the problem of unequal line height and adhesion between font and underline. I don't know whether a wide range of Chinese-English mixed arrangement is applicable, which needs to be checked later. )

Thank you for reading this article carefully. I hope the article "how to solve the problem of mixed arrangement of Chinese and English in web page design" shared by the editor will be helpful to everyone. At the same time, I also hope that you will support and pay attention to the industry information channel. More related knowledge is waiting for you to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.