在IE6.0下，带float:left的li标签，垂直高度英文比中文低1px_html/css_WEB-ITnose
<ul style="list-style:none;text-decoration:underline;"> <li style="float:left;">中文</li> <li style="float:left;">English</li> <li style="float:left;padding-top:1px;">中文</li> <li style="float:left;">English</li> <li style="float:left;">中文</li></ul>
回复讨论(解决方案)
不明白楼主的意思
写个padding-top:1px 做什么？
To：1楼
看来你并没有尝试一下这段代码。你用IE6.0打开就能明白我写这行的意思了
中间三个是平齐的，第一个和最后一个都比中间三个高出一个像素
我写上那个就是说明英文比中文低1px啊，padding-top:1px把第三个li往下挪了1px才能与旁边对齐
它们之间的位置关系是“- _ _ _ -”，没办法这里不能上传本机图片
<!DOCTYPE HTML><html> <head> <meta charset="gb2312" /> <title></title> <style> </style> </head> <body> <ul style="list-style:none;text-decoration:underline;"> <li style="float:left;">中文</li> <li style="float:left;">English</li> <li style="float:left;">中文</li> <li style="float:left;">English</li> <li style="float:left;">中文</li> </ul> </body></html>
去掉padding-top:1px 我这边测试是 水平的。
楼主最好把demo贴全，应该有其他样式 影响到li了
To 4楼：
代码是完整的，没有其他css，直接把所有内容存为*.html即可。
你看看3楼贴出的图，仔细看看就能发现1px高度差
请问你使用的是IE6.0浏览器么？IE6.0.2900.5512
字体弄大了也看不到 楼主?的 高度差
<!DOCTYPE HTML><html> <head> <meta charset="gb2312" /> <title></title> <style> body { font-size:31px; } li { text-decoration:underline; } </style> </head> <body> <ul style="list-style:none;"> <li style="float:left;">中文</li> <li style="float:left;">English</li> <li style="float:left;">中文</li> <li style="float:left;">English</li> <li style="float:left;">中文</li> </ul> </body></html>ie6、7、8 ff opera 都试了，没问题
刚才测试了半天，还以为出了灵异事件呢，通过反复比对才发现：
即使是完全相同的代码，还必须页面的编码是UTF-8才会出Bug，而GB2312则不出Bug
观察发现这两种编码的英文字体居然还不同，GB2312的英文宽度宽一些。
那么，这样的Bug是什么原因呢？如何在不为其改变编码也不改变页面UI的情况下解决呢？
字符集和字体的问题，你在body里先把网站要使用的字符集和字体定义好。估计你用的是微软雅黑吧。换宋体试试
我没有用微软雅黑,根本就没有其他 任何代码,仅仅是对于li使用了float:left，个完整html代码,直接全部复制,以utf-8存为一个*.html文件就能看到，难道这么多程序员朋友们都未曾遇到过这样情况么？这个代码应该算是很常用的才对啊
验证此Bug的步骤：
1.确认您的IE是6.0的
2.打开记事本
3.将1楼全部内容复制粘贴到记事本
4.菜单->文件->另存为，编码选择UTF-8，扩展名html
5.双击刚才所保存的文件
====
按照以上步骤做，您一定能看到我所说的Bug
求助………
有木有人帮帮我……
没问题吧？4楼给出的代码我这里测试也没问题啊
楼主为什么要吧编码方式改成UIF-8？改成那样是有问题了，但，为什么改成那样呢？
网站本身是UTF-8编码的啊，如果仅仅为了这个问题，就更改整个网站的编码，未免有些因小失大了吧？况且UTF-8才是通用的编码。并且，既然有这样的Bug存在，就应该刨根问底，不能一味的以修改编码的方式回避吧？莫非论坛里的程序员们都是仅仅满足于知其然不知其所以然的？
确实有这个问题，应该是不同编码对 中文 英文解析的基准线 不同造成的。
比如这个
<!DOCTYPE HTML><html> <head> <meta charset="utf-8" /> <title></title> <style> body { font-size:50px; font-family:arial; } li { text-decoration:underline; } </style> </head> <body> <ul style="list-style:none;"> <li style="float:left;">中文</li> <li style="float:left;">English</li> <li style="float:left;">中文</li> <li style="float:left;">English</li> <li style="float:left;">中文</li> </ul> </body></html>ie6、7、8 下 字母“g”均超过下划线，并且下划线发生偏移，
ff和chrome下 ，虽然 字母“g”超过下划线，但是 下划线依然很平整。。。
仅仅看到了表象，具体是什么情况，待研究 讨论。。。。
蓝色上面有人讨论过，
先看看
http://bbs.blueidea.com/thread-2878142-1-1.html
感激涕零啊，总算有个明白人了，只不过可惜的是这些我都看过，刚才也仔细阅读了你提供的帖子，总结出纠正这个问题的方法如下：
1.加属性。有三种说法，zoom:1;vertical-align:baseline;display:inline-block;
但是通过我的尝试，全部无效。
2.修改字体。这个影响太大，不是个好办法。
有没有通过CSS Hack解决这个问题的办法呢？(就是类似方法一的)。
谢谢哦。
楼主很钻研啊。。。
http://gigalens.com/2009-07/webstandards-ie6-typographiy-bug.html
<!DOCTYPE HTML><html> <head> <meta charset="utf-8" /> <title></title> <style> body { font-size:24px; font-family:"宋体"; } li { text-decoration:underline; } </style> </head> <body> <ul style="list-style:none;"> <li style="float:left;">中文</li> <li style="float:left;">English</li> <li style="float:left;">中文</li> <li style="float:left;">English</li> <li style="float:left;">中文</li> </ul> </body></html> 额？看来说来说去还是只有一个结论：“改字体”咯？
哎好吧，那我也只有认命了。
我只不过想写出更为“干净”的代码。
熱AI工具
Undresser.AI Undress
人工智慧驅動的應用程序，用於創建逼真的裸體照片
AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。
Undress AI Tool
免費脫衣圖片
Clothoff.io
AI脫衣器
Video Face Swap
使用我們完全免費的人工智慧換臉工具，輕鬆在任何影片中換臉！
熱門文章
熱工具
記事本++7.3.1
好用且免費的程式碼編輯器
SublimeText3漢化版
中文版，非常好用
禪工作室 13.0.1
強大的PHP整合開發環境
Dreamweaver CS6
視覺化網頁開發工具
SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)
HTML容易為初學者學習嗎？
Apr 07, 2025 am 12:11 AM
HTML適合初學者學習，因為它簡單易學且能快速看到成果。 1)HTML的學習曲線平緩，易於上手。 2)只需掌握基本標籤即可開始創建網頁。 3)靈活性高，可與CSS和JavaScript結合使用。 4)豐富的學習資源和現代工具支持學習過程。
HTML，CSS和JavaScript的角色：核心職責
Apr 08, 2025 pm 07:05 PM
HTML定義網頁結構，CSS負責樣式和佈局，JavaScript賦予動態交互。三者在網頁開發中各司其職，共同構建豐富多彩的網站。
了解HTML，CSS和JavaScript：初學者指南
Apr 12, 2025 am 12:02 AM
WebDevelovermentReliesonHtml，CSS和JavaScript：1）HTMLStructuresContent，2）CSSStyleSIT和3）JavaScriptAddSstractivity，形成thebasisofmodernWebemodernWebExexperiences。
Gitee Pages靜態網站部署失敗：單個文件404錯誤如何排查和解決？
Apr 04, 2025 pm 11:54 PM
GiteePages靜態網站部署失敗：404錯誤排查與解決在使用Gitee...
HTML中起始標籤的示例是什麼？
Apr 06, 2025 am 12:04 AM
AnexampleOfAstartingTaginHtmlis，beginSaparagraph.startingTagSareEssentialInhtmlastheyInitiateEllements，defiteTheeTheErtypes，andarecrucialforsstructuringwebpages wepages webpages andConstructingthedom。
如何用CSS3和JavaScript實現圖片點擊後周圍圖片散開並放大效果？
Apr 05, 2025 am 06:15 AM
實現圖片點擊後周圍圖片散開並放大效果許多網頁設計中，需要實現一種交互效果：點擊某張圖片，使其周圍的...
HTML，CSS和JavaScript：Web開發人員的基本工具
Apr 09, 2025 am 12:12 AM
HTML、CSS和JavaScript是Web開發的三大支柱。 1.HTML定義網頁結構，使用標籤如、等。 2.CSS控製網頁樣式，使用選擇器和屬性如color、font-size等。 3.JavaScript實現動態效果和交互，通過事件監聽和DOM操作。
網頁批註如何實現Y軸位置的自適應佈局？
Apr 04, 2025 pm 11:30 PM
網頁批註功能的Y軸位置自適應算法本文將探討如何實現類似Word文檔的批註功能，特別是如何處理批註之間的間�...
