有没有一种方法可以为不同的浏览器设置不同的顶部或底部值？例如，对于Chrome“top: 3px”，但对于Firefox“top: 5px”。

13 浏览
0 Comments

有没有一种方法可以为不同的浏览器设置不同的顶部或底部值？例如，对于Chrome“top: 3px”，但对于Firefox“top: 5px”。

这个问题已经有了答案：

如何仅使用CSS针对Firefox进行定制

我能否为不同的浏览器设定不同的top值呢？例如，Chrome的top为17像素，而Firefox的top为40像素？

我试着为一个类设置top值，但是top值在不同的浏览器中表现不同。例如，我为搜索栏设置了top: 17px，它在Chrome、Safari和Opera中运行良好，但在Firefox中，搜索栏的位置太高了。

然后我将其调整为top: 40px，它们就一样了。所以我想知道是否有一种方法可以为Firefox浏览器设置不同的top值，

例如：-moz-top: 40px？但它不起作用。

admin 更改状态以发布 2023年5月21日
0

2 答案

0 Comments

我认为在同一个文件中无法针对不同的浏览器进行定位，但是您可以使用Javascript浏览器检测来完成这个任务。

    if (BrowserDetect.browser.indexOf("chrome")>-1) {
document.write('<'+'link rel="stylesheet" href="../assets/chromeCSSStyles.css" />');
} else if (BrowserDetect.browser.indexOf("mozilla")>-1) {
    document.write('<'+'link rel="stylesheet" href="../assets/mozillaStyles.css" />');
} else if (BrowserDetect.browser.indexOf("explorer")>-1) {
    document.write('<'+'link rel="stylesheet" href="../assets/explorerStyles.css" />');
}

对于旧版本IE浏览器，您可以使用以下方法：

0
0 Comments

不是通过CSS来实现的。厂商前缀像-moz-或-webkit-被用来试验还没有完全标准化的功能。它们并不打算作为改变特定浏览器行为的方式；标准选择器的厂商前缀版本，比如top，从来没有存在过。\n\n如果你看到你的网站在不同的浏览器上呈现差异，你可能遇到了这些浏览器的用户代理样式表的差异。（例如，由于你提到了搜索栏，输入元素的边距或内边距可能不同。）使用每个浏览器中的Web检查器来确定差异出现的位置，然后在适当的元素上应用属性，使得所有浏览器的行为保持一致，而不是事后纠正不一致性。

0