黑夜的狼

沮丧吗,那就是一种无病呻吟!留恋它就是一种高度近视!目光应该放得更远一点! 别不想飞,只是要一步跨过太平洋!

  博客园 :: 首页 :: 博问 :: 闪存 :: 新随笔 :: 联系 :: 订阅 订阅 :: 管理 ::

用css hack  解决各种兼容性问题

 

CSS hack:区分IE6,IE7,firefox
区别不同浏览器,CSS hack写法:


区别IE6与FF:
       background:orange;*background:blue;


区别IE6与IE7:
       background:green !important;background:blue;


区别IE7与FF:
       background:orange; *background:green;


区别FF,IE7,IE6:
       background:orange;*background:green !important;*background:blue;


注:IE都能识别*;标准浏览器(如FF)不能识别*;
IE6能识别*,但不能识别 !important,
IE7能识别*,也能识别!important;
FF不能识别*,但能识别!important;

 

  IE6 IE7 FF
* √ √ ×
!important × √ √

另外再补充一个,下划线"_",
IE6支持下划线,IE7和firefox均不支持下划线。

于是还可以这样来区分IE6,IE7,firefox
: background:orange;*background:green;_background:blue;

注:不管是什么方法,书写的顺序都是firefox的写在前面,IE7的写在中间,IE6的写在最后面。

自适应高度问题
eg:
div{ background:pink;
width:150px;
height:auto!important;                /*设置火狐和IE7中自定撑开*/
height:50px;                                 /*IE6中最小高度*/
min-height:50px;                       /*火狐和IE7中最小高度*/}

这是兼容浏览器的问题,例子是行高,他们顺序不能倒
eg:
line-height:18px;                   火狐
*line-height :20px;               ie7
_line-height :22px;                ie6

01、让背景图不滚动

IE浏览器支持一个 Body 属性 bgproperties,它可以让背景不滚动:

<Body Background="图片文件" bgproperties="fixed">


02、让你的网页无法另存为

<noscript><iframe src=*></iframe></noscript>


03、让IFRAME框架内的文档的背景透明

<iframe src="about:<body style=‘background:transparent‘>" allowtransparency></iframe>


04、禁止右键:

<body oncontextmenu="return false" ondragstart="return false" onselectstart ="return false" onselect="document.selection.empty()" oncopy="document.selection.empty()" onbeforecopy="return false"onmouseup="document.selection.empty()">


05、进入页面后立即自动刷新?

<meta http-equiv="refresh" content="120;url=http://www.qpsh.com">

http://www.qpsh.com,这是你自己的网址。



06、打开窗口即最大化

<script language="JavaScript">

  <!-- Begin

  self.moveTo(0,0)

  self.resizeTo(screen.availWidth,screen.availHeight)

  // End -->

</script>


07、能隐藏IFRAME的滚动条吗?我知道的三种方法:

(1)、设置iframe scrolling="no"

(2)、被包含页body应用overflow:hidden

(3)、被包含页的body标签加scroll="no"

08、加入背景音乐

<bgsound src="mid/windblue[1].mid" loop="-1"> 只适用于IE
<embed src="music.mid" autostart="true" loop="true" hidden="true"> 对Netscape ,IE ,TT都适用

09、嵌入网页

<iframe name="tt" src="01a.html" width="450" height="287" scrolling="Auto" frameborder="0"></iframe>


10、跳转

<meta http-equiv="refresh" content="3;URL=list.htm">


11、滚动
<MARQUEE direction=up height=146 onmouseout=start() onmouseover=stop() scrollAmount=4></marquee>

12、细线分隔线

<hr noshade size=0 color=#C0C0C0>

13、过度方式

<meta http-equiv="Page-Exit" content="revealTrans(Duration=3,Transition=5)">

Duration的值为网页动态过渡的时间,单位为秒。

Transition是过渡方式,它的值为0到23,分别对应24种过渡方式。如下表:

0 盒状收缩 1 盒状放射

2 圆形收缩 3 圆形放射

4 由下往上 5 由上往下

6 从左至右 7 从右至左

8 垂直百叶窗 9 水平百叶窗

10 水平格状百叶窗 11垂直格状百叶窗

12 随意溶解 13从左右两端向中间展开

14从中间向左右两端展开 15从上下两端向中间展开

16从中间向上下两端展开 17 从右上角向左下角展开

18 从右下角向左上角展开 19 从左上角向右下角展开

20 从左下角向右上角展开 21 水平线状展开

22 垂直线状展开 23 随机产生一种过渡方式


15、如何控制横向和纵向滚动条的显隐?

<body style="overflow-y:hidden"> 去掉x轴
<body style="overflow-x:hidden"> 去掉y轴
<body scroll="no">不显

16、怎样在 FrontPage2000 中加入 Flash 动画?

在 FrontPage2000 中,点击[插入]->[高级]->[插件],在弹出的窗口中,设置一下 Flash 文件的大小及其它信息,确定即可。

17、加入注释的格式是:
<!-[注释内容…]-->

18、怎样在网页中加入 E-mail 链接并显示预定的主题?

<A href="mailto:Email@263.net?subject=主题">……</a>


19、定义本网页关键字,可以在<Head></Head>中加入如下代码:

<meta name="Keywords" content="china,网页特效园地,business,net">

Content 中所包含的就是关键字,你可以自行设置。

这里有个技巧,你可以重复某一个单词,这样可以提高自己网站的排行位置,如:

<meta name="Keywords" content="china,china,china,china">

20、IE5.0 的部分快捷键:

A:打开查找功能:Ctrl+F

关闭浏览器窗口:Ctrl+W

打开地址栏下拉列表框:F4

刷 新:F5

将当前Web页保存到收藏夹列表:Ctrl+D

打开当前 IE 窗口的一个拷贝:Ctrl+N

停止下载当前网页:Esc

光标迅速移动到网页的开头:Home

光标迅速移动到网页的尾部:End

打开新的地址键入窗口:Ctrl+O

打开收藏夹:Ctrl+I

打开历史记录文件夹:Ctrl+H

打开浏览器设定的默认主页:Alt+HOME

21、添加到收藏夹:

<a href="javascript:window.external.addFavorite(‘http://链接‘,‘说明‘);">添加到收藏夹</a>

22、设为首页:

<a href=# onclick=this.style.behavior=‘url(#default#homepage)‘;this.setHomePage(‘http://链接‘);>设为首页</a>

23、定制浏览器地址栏前的小图标:

A:在网页的<head></head>间加入以下语句:


link rel="shortcuticon" href="http://…/icon.ico">


即可。其中 icon.ico 为 16x16 的图标文件,颜色不要超过 16 色。

24、把滚动条放在浏览器窗口的左边

A:在 <body> 中加 dir=RTL,即 <body dir=RTL>。

背景(Backgrounds)
背景的属性如下:

background-color:#f00;
background-image:url(background.gif);
background-repeat:no-repeat;
background-attachment:fixed;
background-position:0 0;
可以缩写为一句:background:#f00 url(background.gif) no-repeat fixed 0 0;

语法是background:color image repeat attachment position;

你可以省略其中一个或多个属性值,如果省略,该属性值将用浏览器默认值,默认值为:

color: transparent
image: none
repeat: repeat
attachment: scroll
position: 0% 0%
字体(fonts)
字体的属性如下:

font-style:italic;
font-variant:small-caps;
font-weight:bold;
font-size:1em;
line-height:140%;
font-family:"Lucida Grande",sans-serif;
可以缩写为一句:font:italic small-caps bold 1em/140% "Lucida Grande",sans-serif;

注意,如果你缩写字体定义,至少要定义font-size和font-family两个值。

列表(lists)
取消默认的圆点和序号可以这样写list-style:none;,

list的属性如下:

list-style-type:square;
list-style-position:inside;
list-style-image:url(image.gif);
可以缩写为一句:list-style:square inside url(image.gif);

posted on 2010-11-16 17:39  anncesky  阅读(263)  评论(0编辑  收藏  举报