零基础建站培训介绍

当前位置:

解决网站css样式兼容不同浏览器问题

很多网站都有一个很大的问题,在这个浏览器上显示正常,但在其它浏览器显示却错位。这就是网站浏览器不兼容。

解决网站css样式兼容不同浏览器问题

如果你在自己建网站时也遇到了不同浏览器之间不兼容问题,可以通过本文以下语句实现DIV+CSS在不同浏览器使用不同样式。

例如我们需要增加的样式为:
.classname{

margin-top:-15px;

}

那么在IE8浏览器下的书写方式为:
.classname{

margin-top:-15px\0;

}

IE9浏览器下的书写格式为:
.classname{

margin-top:-15px\9\0;

}

IE8和IE9浏览器同时兼容的格式为:
.classname{

margin-top:-15px\8\9\0;

}

火狐浏览器的单独写法为:
/* Firefox */

@-moz-document url-prefix() {

.classname{

margin-top:-15px;

}

}

谷歌浏览器的单独写法为:
/* Chrome */

@media screen and (-webkit-min-device-pixel-ratio:0) {

.classname{

margin-top:-15px;

}

}

火狐谷歌同时兼容的写法为:
/* Chrome 和 opera */

@media all and (min-width:0){

.classname{

margin-top:-15px;

}

}
最后,网站做好之后,再使用IETester软件测试你的网站是否浏览器兼容正常。

上一课: 下一课:

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

相关教程

  • CSS3多栏布局columns (5914 次浏览)
    CSS3多栏布局columns语法:columns: <'column-width'> || <'column-count'>;column-width:用来设置列宽,取值auto和像素值,实际
  • 一个蓝色主题的导航条布局案例,本CSS小实例,采用DIV CSS实现。同时不用图片做背景,直接使用背景色实现,鼠标经过悬停对应栏目名称是对应背景蓝色变
  • 响应式HTML网页可以自动适应不同浏览设备而自动变化版面,下面介绍一下怎么制作一个响应式HTML网页的方法和步骤。打开Dreamweaver软件,新建一个HTM
  • div+css布局是什么意思 (4967 次浏览)
    div css 是一种网页的布局方法,这一种网页布局方法有别于传统的HTML网页设计语言中的代码定位方式,可实现网页页面内容与表现相分离。简单来说就是
  • 我们学习CSS3视频教程时,做网站经常会看到CSS代码里会有一个ZOOM:1,删除ZOOM:1属性对网页却没有任意影响。那么ZOOM:1到底有什么作用呢?下面就跟
  • 我们在自己建网站时,经常需要用到background属性。我们还可以通过background-size来控制背景图片的尺寸。background-size有几个属性值,常用的是cov
  • CSS常用属性大全 (9189 次浏览)
    什么是CSS?CSS全称为Cascading Style Sheets,中文翻译为“层叠样式表”,简称CSS样式表,所以称之为层叠样式表(Cascading Stylesheet)简称CSS。在
  • 在自己建网站时,CSS是控制网站各类样式的文件,CSS全部是英文,为了方便学建网站新手使用CSS,下面是学做网站论坛总结的常用CSS英文汉语词汇对照表.
  • 学习了网站制作课程的学员都知道,网站的样式都是受CSS来控制的。下面是控制的CSS样式代码:强制不换行div{white-space:nowrap;}
  • Animate动画名称大全 (51451 次浏览)
    animate.css 是一个来自国外的 CSS3 动画库,它预设了抖动(shake)、闪烁(flash)、弹跳(bounce)、翻转(flip)、旋转(rotateIn/rotateOut)、淡