Web Design Skills: High Ranking Problems of Mixed Chinese and English Web Pages
<br />I'm basically going crazy with this problem. The symptoms are as follows  Symptom description: In Internet Explorer (I haven't tried 6, 7, or 8), when Chinese and English are mixed, the default font is used, and the li list is used for float, the above symptom will appear, and the text will not be aligned vertically. It affects the aesthetics of the layout. The reason for the situation in the above picture is that the baselines of Chinese and English texts are different. The lower edge of the Arial font is one pixel lower than that of the Song font (both are size 12), and the upper edge is two pixels lower than that of the Song font. In addition, English also has i, y, which have different upper and lower baselines. Therefore, when Chinese and English are mixed and aligned, there will be an obvious height difference, making the layout uneven. See enlarged image.  Use Song font for both Chinese and English text  This can solve the problem of misaligned text, but Times New Roman is a serif font (Times New Roman is a serif font in English). The font is compact and has many details. It is very eye-catching when arranged together, but when it is written continuously, it is easy to cause recognition difficulties and read the wrong line. For more information on the pros and cons of serif fonts, see this article. In contrast, sans serif fonts are more beautiful and elegant when used to represent English. Solution 1: The discovery of the “dumpling” kid’s shoes. English uses Tahoma font – Comparison of Song, Arial and Tahoma fonts – Arial and Tahoma sans serif fonts are more refined  When using tahoma fonts for mixed Chinese and English text  The line heights of the mixed Chinese and English and pure Chinese combinations are consistent, but the underline of a is attached to the Chinese text when it is in hover state. Defect: When using the Tahoma font, in IE6 and earlier versions, the underline of all Chinese font links will stick to the font. Taobao also uses this solution. I believe that in large projects, when different people work together to complete a page module, it is worthwhile to make the font more standardized and reduce misalignment under unified specifications, and to use the tahoma font with underlines that will appear to be stuck to the font. The following is what I found with my friends : Arial font is used for English and Song font is used for Chinese. You can specify line-height:1.231 in the <a> tag to solve the problem of unequal line heights and the problem of font and underline sticking together. (I don’t know whether it is applicable to a large-scale mixed typesetting of Chinese and English. This needs further verification.)  Summary: Thanks for the rice, thanks for the dumplings, thanks for YUI, and thanks for Taobao! |
<<: MySQL uses frm files and ibd files to restore table data
>>: An article to help you understand the basics of VUE
Recommend
How to write the parent and child directories of HTML relative paths
How to indicate the parent directory ../ represent...
Navicat multiple ways to modify MySQL database password
Method 1: Use the SET PASSWORD command First log ...
How to implement import and export mysql database commands under linux
1. Export the database using the mysqldump comman...
Explanation and example usage of 4 custom instructions in Vue
Four practical vue custom instructions 1. v-drag ...
What is WML?
WML (Wireless Markup Language). It is a markup la...
Who is a User Experience Designer?
Scary, isn't it! Translation in the picture: ...
Why should the number of rows in a single MySQL table not exceed 5 million?
Today, let’s discuss an interesting topic: How mu...
Detailed description of the function of new in JS
Table of contents 1. Example 2. Create 100 soldie...
XHTML tags that are easily confused by the location of the use
<br />We have always emphasized semantics in...
Tips for using the docker inspect command
Description and Introduction Docker inspect is a ...
Detailed explanation of the frame and rules attributes of the table in HTML
The frame and rules attributes of the table tag c...
Summary of 4 ways to add users to groups in Linux
Preface Linux groups are organizational units use...
Detailed explanation of Java calling ffmpeg to convert video format to flv
Detailed explanation of Java calling ffmpeg to co...
Detailed explanation of MySQL user rights verification and management methods
This article uses examples to illustrate how to v...
IIS7 IIS8 http automatically jumps to HTTPS (port 80 jumps to port 443)
IIS7 needs to confirm whether the "URL REWRI...