html中怎么让div层固定在屏幕中央右边500像素的位置
显示屏是可变大小的，不同的像素条件下都要让div层固定在屏幕中央右边500像素的位置。高分求助。显示屏是可变大小的:意思就是网站是供不同的人浏览的，每个人的显示器都不一样...
显示屏是可变大小的，不同的像素条件下都要让div层固定在屏幕中央右边500像素的位置。高分求助。
显示屏是可变大小的:意思就是网站是供不同的人浏览的，每个人的显示器都不一样。
让div层固定在屏幕中央右边500像素的位置：过程就是无论什么显示器，先选取最中间的一点，然后以这个中心点往右边偏移500像素，明白？ 展开
显示屏是可变大小的:意思就是网站是供不同的人浏览的，每个人的显示器都不一样。
让div层固定在屏幕中央右边500像素的位置：过程就是无论什么显示器，先选取最中间的一点，然后以这个中心点往右边偏移500像素，明白？ 展开
5个回答
展开全部
html中让div层固定在屏幕中央右边500像素的位置,这个的话，我就需要用html中的position的绝对定位来做，我们需要提前知道的有div距离中间的距离，上边的距离，右边的距离，这三个是需要知道的，这里我写一段代码：
<html>
<head>
<tltle>diV固定位置</tltle>
<style>
div{
width:300px;
height:300px;
position:absoult;
right:500px; //只是假设的数据，需要实际测量
top:400px;
}
</style>
</head>
<body>
<div>我是测试文字</div>
</body>
</html>
<html>
<head>
<tltle>diV固定位置</tltle>
<style>
div{
width:300px;
height:300px;
position:absoult;
right:500px; //只是假设的数据，需要实际测量
top:400px;
}
</style>
</head>
<body>
<div>我是测试文字</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
简单啊
绝对定位啊
用JS写
直接用JS得到屏幕的宽度，那么中心的坐标就是屏幕的宽度/2
在用JS得到外围容器的宽度，拿屏幕的宽度-外围容器的宽度得到边缘的宽度
这样在拿中心的坐标-边缘的宽度，就得到当前站点容器中心宽度的坐标了
然后吧外围容器设置相对定位，你的DIV层设置绝对宽度
left设置为容器中心宽度坐标+500就行了
注意写JS的时候要注意浏览器兼容性
最后写出来的坐标要加px
绝对定位啊
用JS写
直接用JS得到屏幕的宽度，那么中心的坐标就是屏幕的宽度/2
在用JS得到外围容器的宽度，拿屏幕的宽度-外围容器的宽度得到边缘的宽度
这样在拿中心的坐标-边缘的宽度，就得到当前站点容器中心宽度的坐标了
然后吧外围容器设置相对定位，你的DIV层设置绝对宽度
left设置为容器中心宽度坐标+500就行了
注意写JS的时候要注意浏览器兼容性
最后写出来的坐标要加px
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
不知道你的“固定中央又距离右边500px什么意思”，按我的理解写了一个，
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
window.onload = function(){
for(var i = 0;i<200;i++){
document.getElementById('outer').innerHTML += i + '<br />';
}
}
</script>
<style type="text/css">
*{
padding:0;
margin:0;
}
#outer{
height:3000px;
}
#fixed{
position:fixed;
width:200px;
height:200px;
right:500px;
top:50%;
margin:-102px 0 0 0;
border:solid 2px gray;
background:white;
}
#ruler{
position:fixed;
border-bottom:solid 1px #ccc;
text-align:center;
width:500px;
right:0;
top:50%;
}
</style>
</head>
<body>
<div id="outer"></div>
<div id="fixed">yummmy! I m fixed guy:D</div>
<div id="ruler">500px away from the right side</div>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
window.onload = function(){
for(var i = 0;i<200;i++){
document.getElementById('outer').innerHTML += i + '<br />';
}
}
</script>
<style type="text/css">
*{
padding:0;
margin:0;
}
#outer{
height:3000px;
}
#fixed{
position:fixed;
width:200px;
height:200px;
right:500px;
top:50%;
margin:-102px 0 0 0;
border:solid 2px gray;
background:white;
}
#ruler{
position:fixed;
border-bottom:solid 1px #ccc;
text-align:center;
width:500px;
right:0;
top:50%;
}
</style>
</head>
<body>
<div id="outer"></div>
<div id="fixed">yummmy! I m fixed guy:D</div>
<div id="ruler">500px away from the right side</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<div style='margin-right:500px'></div>
你如果想让他固定在每个位置，针对不同的显示器就用
<div style='margin-left:50%;></div>
用百分数 具体位置你改百分比
你如果想让他固定在每个位置，针对不同的显示器就用
<div style='margin-left:50%;></div>
用百分数 具体位置你改百分比
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
设置层的属性：<div style="position:fixed; right:500PX;"></div>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（3）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
