仓酷云

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 734|回复: 9
打印 上一主题 下一主题

[DIV+CSS] 来一发网页的中英笔墨体对齐成绩的办理

[复制链接]
深爱那片海 该用户已被删除
跳转到指定楼层
楼主
发表于 2015-1-16 00:10:25 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
最新版本html5+CSS3与2014年10月29日,万维网联盟宣布,经过几乎8年的艰辛努力,该标准规范终于最终制定完成。
假如不是由于总监检察严厉,必定请求这个细节办理失落,大概我也不会往穷究本源性的办理举措,再此感激MTIME卖力而严厉的同事。
起首形貌一下成绩:



假如所示,在IE下当一行笔墨同时有英文跟中文的时分,链接下划线就会产生折行,也就暗示这个时分中英文是没有对齐的!(FIREFOX不受此成绩影响)
可是经由测试,默许的间接在页面里设置链接的时分是不会呈现这个情形的!
代码拷贝框
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metacontent="text/html;charset=utf-8"http-equiv="Content-Type"/><title>Mtime光阴网</title><styletype="text/css">*{margin:0;padding:0;}html{background:#fff;}body{position:relative;font:12px/1.6emVerdana,Lucida,Arial,Helvetica,宋体,sans-serif;color:#333;}</style></head><body><div><ahref="http://www.mtime.com"id="aa"title="Mtime光阴网">为何我总是对不齐呢?why??</a></div></body></html>
[Ctrl+A全体选择然后拷贝]
怎样办理这个成绩呢?!
先说第一种,就是邻近元素的vertical-middle招致的没法对齐的偏向成绩办理计划:
给中英文工具加一个zoom:1触发它的haslayout,经由过程研讨发明一旦它有了haslayout以后,中英文就不会对不齐。
代码拷贝框
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metacontent="text/html;charset=utf-8"http-equiv="Content-Type"/><title>Mtime光阴网</title><styletype="text/css">*{margin:0;padding:0;}html{background:#fff;}body{position:relative;font:12px/1.6emVerdana,Lucida,Arial,Helvetica,宋体,sans-serif;color:#333;}</style></head><body><div><ahref="http://www.mtime.com"id="aa"title="Mtime光阴网">为何我总是对不齐呢?why??</a></div></body></html>
[Ctrl+A全体选择然后拷贝]
可是我们能够看到,下划线仿佛贴的过紧,这个时分我们仍然还必要给它加句zoom:1;触发它的hasLayout来制止过紧贴合!。
代码拷贝框
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metacontent="text/html;charset=utf-8"http-equiv="Content-Type"/><title>Mtime光阴网</title><styletype="text/css">*{margin:0;padding:0;}html{background:#fff;}body{position:relative;font:12px/1.6emVerdana,Lucida,Arial,Helvetica,宋体,sans-serif;color:#333;}</style></head><body><divstyle="vertical-align:middle;"><ahref="http://www.mtime.com"id="aa"title="Mtime光阴网"><imgsrc="http://i.mtime.cn/20080731114455/images/logo_main.png"alt="Mtime光阴网"/></a><ahref=""style="zoom:1;vertical-align:baseline;">为何我总是对不齐呢?why??</a></div></body></html>
[Ctrl+A全体选择然后拷贝]
假如您碰着其他情形的中英文对不齐的情形,那末也能够实验利用上述两种办法来办理。固然最保险最无效的莫过于就是间接中英文都一致利用宋体。

在网页制作中,有许多的术语,例如:CSS、HTML、DHTML、XHTML等等。在下面的文章中我们将会用到一些有关于HTML的基本知识。
再见西城 该用户已被删除
沙发
发表于 2015-1-18 05:25:28 | 只看该作者
在Dreamweaver里可以很轻松的完成图文混排、插入图片、插入Flash、插入音频、插入视频。
变相怪杰 该用户已被删除
板凳
发表于 2015-1-18 05:25:28 | 只看该作者
在Dreamweaver里可以很轻松的完成图文混排、插入图片、插入Flash、插入音频、插入视频。
简单生活 该用户已被删除
地板
发表于 2015-1-24 16:11:31 | 只看该作者
Dreamweaver是唯一提供Roundtrip HTML、视觉化编辑与原始码编辑同步的设计工具。它包含HomeSite和BBEdit等主流文字编辑器。
老尸 该用户已被删除
5#
发表于 2015-2-2 10:58:40 | 只看该作者
还是在Dreamweaver所见即所得添加链接是,可以选中文字或图片然后按下shift键不放鼠标拖出箭头直接指向文件即可。这是比较简单的也是常用的方之一。
透明 该用户已被删除
6#
发表于 2015-2-7 18:42:19 | 只看该作者
这个过程其实就是交流的过程。所有的这些都需要花时间。在面对完全陌生的软件时,就要多花时间对其产生初步的印象。此外,多操作也是非常重要的。
愤怒的大鸟 该用户已被删除
7#
发表于 2015-2-23 02:07:28 | 只看该作者
可以使用 CSS 检查工具进行设计。
海妖 该用户已被删除
8#
发表于 2015-3-7 07:17:18 | 只看该作者
您在所见即所得网页编辑器进行网页制作和在WORD中进行文本编辑不会感到有什么区别,但它同时也存在着致命的弱点。
再现理想 该用户已被删除
9#
发表于 2015-3-14 17:39:32 | 只看该作者
使用内容管理系统进行开发并实现快速、精确的浏览器兼容性测试。
灵魂腐蚀 该用户已被删除
10#
发表于 2015-3-21 14:33:20 | 只看该作者
布局表格、绘制层、制作CSS样式表等,这些内容迷糊了我的视线,真是没想到制作一个精巧别致的网页是如此的困难,可是心有不甘。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|仓酷云 鄂ICP备14007578号-2

GMT+8, 2024-12-23 06:18

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表