chrome中的不同文本位置.IE和FF
M T*_*M T 7 html css internet-explorer google-chrome
我正在建立一个css和jquery的网站.我的一个脚本是在鼠标单击的特定位置显示文本.文本在谷歌浏览器的预定位置显示良好.但是在IE9和FF17中,它们从预定的位置移开.我的背景图像适合浏览器窗口的大小.
我附上截图,这将提供更好的主意.我也在写代码.也许只需要一个小的调整,但我不明白.请帮帮我.
这是chrome和IE之间的比较.正确的是铬合金,这是正确的.FF和IE显示在相同的位置.
谢谢
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
*Here will my script which is just simple .show and .hide functions*
});
</script>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
<title>Train of Thought</title>
<style type="text/css">
html, body {
width: 100%;
height: 100%;
margin-top: 0px;
padding-top: 0px;
top: 0px;
margin-left: 0px;
padding-left: 0px;
left: 0px;
}
body {
overflow: hidden;
}
#background {width: 100%; height: 100%; display: block; position: absolute; z-index:1;}
.content {
visibility:hidden;
border-style: none;
display: block;
position: fixed;
text-align: centre;
z-index: 1;
margin-top: 40%;
background-color: transparent;
font-size:1.5em;
opacity: 0.697;
}
#thought_text{
margin-left: 25%;
margin-right: 25%;
}
<div><img id="background" alt="background" src="tot1.png"></div>
<div class="content" id="thought_text">Here goes the text<br></div>
考虑删除#thought_text{}css 文件中的块并将其合并到.content {}块中以避免覆盖属性值
或者
添加 !important 指令到属性
并且也改变
margin-top: 40%;某个固定值，例如margin-top: 250px;确保所有浏览器中的顶部位置相同。
| 归档时间： |
|
| 查看次数： |
1844 次 |
| 最近记录： |