CSS 那些事儿
作者:荆棘鸟 来源:荆棘鸟's Blog 发布时间:2008-12-02 18:19:00
一、避免Firefox 背景图不显示的兼容问题,定义background 属性,先后顺序不能随意变动。
background : background-color || background-image || background-repeat || background-attachment || background-position
示例:
div { background: red no-repeat scroll left center }
二、IE图文混排,li 多出空白间距兼容问题,定义li display: block; height=高度值。
三、一般排版尽可不用margin,避免ie firefox双倍边距兼容问题。
竖向空白间距,采用双层div嵌套,用外层div 的padding 值控制版块的栏间距,内层div 控制版块实际宽度样式。
横向空白间距,用专门的div空白行代替,如
<div class="blankline">
四、尽量不用css hack,以免新的浏览器出来,出现新的兼容性问题。
五、命名标准
一律小写;
尽量用英文;
不加中杠和下划线;
尽量不缩写,除非一看就明白的单词。
六、用空白行代替竖向间距margin,不设height 值,为了避免IE6的height最小值为设定的字号高度问题。
<div class="blankline"></div>
.blankline
padding-top: 5px;
}
如果设为 height: 5px; IE6下高度就会变为所设定的字体高度,远大于5px。
七、color 必须设定在font 定义之后,否则定义不起作用。
font-size: 100%;
font-weight: bolder;
color: #555555;
八、换行控制。
word-wrap 控制换行 { break-word 强制换行 }
word-break 控制断词 { break-all 换行时折分字母 keep-all 换行时英文按词换行,中文按句从有标点符号处换行 */
下图是使用keep-all属性,对于英文内容使用较好,可以换单词换行,不折单词中的字母,如果是中文,则从有标点符号处换号,使中文版面看起来较乱。所以,中文建议用break-all,英文用keep-all 。
对于Firefox,长串英文不能自动换行,对此网上有JS解决办法,但是对于小网站为这点小毛病兴师动众有些划不来,超长部分就用overflow: hidden;隐藏起来好了。
如果你是完美主义者,也可以看看老外的解决方案:
http://www.hedgerwow.com/360/dhtml/css-word-break.html
最后总结一下:兼容IE和Firefox的换行问题的CSS方法是:
table-layout: fixed; /* 防止撑开IE表格 */
word-wrap: break-word; /* 强制换行 */
word-break: break-all; /* 按字母折分 */
overflow: hidden; /* Firefox 超长隐藏 */
猜你喜欢
- js汉字简繁转换源代码:<html> <head> <title>汉字简繁转换工具_asp之家</
- 浏览器对于CSS的支持问题落后于CSS的发展,以占有市场绝对份额的Internet Explorer来说,直到其前不久发布的第8个版本才刚刚
- <%@LANGUAGE="xxx" CODEPAGE="936"%>一般又分为<%
- Facebook的网站速度做为最关键的公司任务之一。在2009年,我们成功地实现了Facebook网站速度提升两倍 。而正是我们的工程师团队
- 在 Internet 连接无处不在的今天,我们忽然有了另外一个需求,离线 Web。Gmail, Google Reader, Zoho 这些
- 通过学习ASP明明白白你的If语句流程。If condition Then [statements1]E
- 如果遇到与文件许可有关的问题,可能数启动mysqld时UMASK环境变量设置得不正确。例如,当你创建表时,MySQL可能会发出下述错误消息:
- 在CSS森林群里讨论一个margin的问题中无意间发现overflow也可以用来清除浮动,嘿嘿,这个方法不单使用简单,而且FF、OP、IE7
- Oracle客户端NLS_LANG设置 OracleWindowsMicrosoftUnixBash 1. NLS_LANG 参数组成 NL
- IE下专属CSS:<![if !IE]><link rel="stylesheet" type=&qu
- 在编程时你一定碰到过时间触发的事件,在VB中有timer控件,而asp中没有,假如你要不停地查询数据库来等待一个返回结果的话,我想你一定知道
- 公司客户在使用网站后台编辑添加修改内容时,经常是直接从word文档里复制内容到编辑器里后就提交。结果是在内容显示页面上是五花八门的样式,有时
- 在制作网页以及编程的时候,适当的进行注释,不仅使自己的思路清晰,极大地减轻了维护的难度,而且方便项目组其他人了解你的代码,方便对代码的理解以
- 一、首先从SQLServer中Error讲起,SQL中错误处理有些怪辟 错误级别同是16但结果都不同。select *
- 本文介绍了随机提取N条记录的例子,通过Sql server与access数据库的代码比较让你更快的掌握。随机提取10条记录的例子:Sql s
- 在面向对象的编程中,很多语言都支持函数重载,能根据函数传递的不同个数、类型的参数来做不同的操作,JS对它却不支持,需要我们额外做些小动作。在
- 很多人可能认为门户网站首页设计只是把一些导航、资讯内容和广告堆积起来摆放得好看就可以了,虽然这个观点也并不是完全错误的,确实门户网站首页是由
- Dreamweaver MX 2004的强大功能以及更加完善的人性化设置已经深受大家喜爱。在此笔者就谈
- 怎样才能将在表A取得的数据插入另一个表B中?(1)对于表A和表B两个表结构完全相同的话〔字段个数,相应字段的类型等等〕,可以使用 inser
- 复制代码CREATE FUNCTION fGetStrBySplit ( @Source VARCHAR(max), @Index INT,