同步内容CSS Hack方法收集

PfUOnIOhw

DIV+CSS常见错误汇总

CSS+DIV是网站标准(或称“WEB标准”)中常用的术语之一,通常为了说明与HTML网页设计语言中的表格(table)定位方式的区别,因 为XHTML网站设计标准中,不再使用表格定位技术,而是采用css+div的方式实现各种定位。应用应用DIV+CSS编码时很容易犯一些错误。本文列 举了一些常见的错误:

1. 检查HTML元素是否有拼写错误、是否忘记结束标记

即使是老手也经常会弄错div的嵌套关系。可以用dreamweaver的验证功能检查一下有无错误。

2. 检查CSS是否正确

IE8 的CSS hack

CSS 兼容性一直是大家头疼的问题,IE6、IE7和FF已经让大家够呛,在以前的文章中,很多这方面的知识介绍。今天向大家介绍IE8的CSS hack。

  IE8正式版发布以来,一直在找一种区别IE8正式版的方法.在百度搜索"IE8
hack"有19万多个结果,google搜索则有243万多个结果,但几乎没有看到任何一种有效的方法是针对IE8正式版的,要知道IE8正式版和测试
版在hack上是有很大区别的.而且网络上的方法几乎都是出自一两个人之手,最有名的可能要数那张linxz.cn的hack图片了,这张图片估计被国内
的网友转载了几十万次,但目前这张图里的方法对IE8正式版是无效的.

  经过分析和总结网友们的各个无效方法,有了下面的行之有效的解决方案,或许以后还会有更好更简单的hack,但就目前来说这个方法可以解决燃眉之急.

网站中插入提示用户升级IE6的脚本

IE6 更新警告

这是一个小脚本用于显示警告信息提示用户更新当前浏览器版本。

这种想法是迫使用户去升级他的IE6 且避免网站不会因为在IE6下无法正常显示而使网站给用户造成一个不好的印象。

安装:
仅需要插入代码:

多行文本垂直居中

我们已经知道单行文本可以采用行高与高度一致来实现,但是多行文本该怎么实现呢?

Html代码:
 <div id="outer">
  <div id="middle">
    <div id="inner">

IE6下的 img边缘空白以及浮动和inline box 问题

遇到两个个问题,以前虽然经常解决完就算,但真要问到为什么,却不一定说得出来:

1、为什么在IE6图片的边缘会有空白?
解决的方法有很多:

  • 给div设overflow:hidden或font-size:0
  • 给img设float或display:block或vertical-align

但究其原因,也许是IE6中始终带有haslayout,而在此情况下IE6对行高和line-box的解释不正确有关

2、这样的结构:text

abc

,为什么那个p不是和内联元素在同一行呢?
流行的做法有很多:

  • 改成这样的结构:text

    abc

CSS Hack技术速查对照

屏蔽IE浏览器(IE下不显示)

*:lang(zh) select {font:12px !important;} /*FF,OP可见*/
select:empty {font:12px !important;} /*safari可见*/

这里select是选择符,根据情况更换。第二句是MAC上safari浏览器独有的。
仅IE7识别

*+html {…}

当面临需要只针对IE7做样式的时候就可以采用这个HACK。
IE6及IE6以下识别

Opera 浏览器介绍

  Opera起初是一款挪威Opera Software ASA公司制作的支持多页面标签式浏览的网络浏览器,由于新版本的Opera增加了大量网络功能,官方将Opera定义为一个网络套件。
  Opera是一个小巧而功能强大的跨平台互联网套件,包括网页浏览、下载管理、邮件客户端、RSS阅读器、IRC聊天、新闻组阅读、快速笔记、幻灯显示(Operashow)等功能。
Opera 支持多种操作系统,如Windows、linux、Mac、FreeBSD、Solaris、BeOS、OS/2、QNX等,此外,Opera还有手机用的版本,在2006年更与Nintendo签下合约,提供NDS及Wii游乐器Opera浏览器软件;也支持多语言,包括简体中文和繁体中文。