代码如下:
扩展资料
关于CSS固定某个div始终位于页面右侧主要的positon属性介绍:
该属性规定元素的定位类型,这个属性定义建立元素布局所用的定位机制。任何元素都可以定位,不过绝对或固定元素会生成一个块级框,而不论该元素本身是什么类型。相对定位元素会相对于它在正常流中的默认位置偏移。
可能的值:
(1)absolute。生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。
(2)fixed。生成绝对定位的元素,相对于浏览器窗口进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。
(3)、relative。生成相对定位的元素,相对于其正常位置进行定位。因此,"left:20" 会向元素的 LEFT 位置添加 20 像素。
(4)、static。默认值。没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明)。
(5)、inherit。规定应该从父元素继承 position 属性的值。
给个HTML和CSS文件你自己看,就能明白HTML的坐标是什么样的了。HTML文件用CSS控制定位的坐标相当于你打开附件看到的样子,不过没有显示出来而已。当然附件只画出在绝对定位情况下 width: 1000px; height: 1000px; 的坐标,更大范围的坐标没有画出来。
下载附件,然后打开就有了。
没那么麻烦,给div定义一个display:block(呈块状)属性,然后float:right就OK了
<div style="width:100px;height:100px;border:1px solid #000000">
<div style="width:50px;height:50px;border:1px solid #000000;display:block;float:right"></div>
</div>
已测试通过,符合你的要求。
呵呵,,不知道你会不会JQUERY,给你一个JQ的代码吧:
获取IMG绝对X,Y坐标,可以用offset()方法:
var X = $('#img1')offset()top;
var Y = $('#img1')offset()left;
获取相对(父元素)位置:
var X = $('#img1')position()top;
var Y = $('#img1')position()left;
我写了一个网页,你保存成HTM文件就可以运行了。
你在设置坐标中输入对应的值,就可以获取到相对于页面的坐标了。
——这里告诉你如何获得页面坐标和设置页面坐标。
另外楼主不厚道哦,都没有分的。
<html>
<head>
<style type="text/css">
#test{
position:absolute;
left:100px;
top:100px;
}
</style>
<script type="text/javascript">
function click_me()
{
alert("div相对于页面的坐标:X="+documentall("test")currentStyleleft+" Y="+documentall("test")currentStyletop);
}
function set_pos()
{
documentall("test")styleleft=parseInt(ipt1value);
documentall("test")styletop=parseInt(ipt2value);
alert("坐标设置成功!");
}
</script>
</head>
<body>
<div id="test">测试<button onclick="click_me()">显示坐标</button> 输入横坐标:<input id=ipt1 type="text" size="3" />输入纵坐标:<input id=ipt2 type="text" size="3" /><button onclick="set_pos();">设置坐标</button></div>
</body>
</html>
jquery给一个DIV设置坐标也就是设置left和top的距离。
具体举例如下:
1、定义页面中的div
<div id="div1" >测试设置坐标</div>
2、编写jquerry脚本设置div的postion属性
// 获取div1对象
var d = documentgetElementById('div1');
// 设置position属性为绝对absolute
dstyleposition = "absolute";
// 设置left像素为100px
dstyleleft = '100px';
//设置top像素为200px
dstyletop ='200px';
或者也可以定义坐标传入以下函数:
//定义函数placeDiv,两个入参:x_pos和y_pos
function placeDiv(x_pos, y_pos) {
//获得div1这个dom对象
var d = documentgetElementById('div1');
// 设置position属性为绝对absolute
dstyleposition = "absolute";
//设置left像素为x_pos px
dstyleleft = x_pos+'px';
//设置top像素为y_pos px
dstyletop = y_pos+'px';
}
以上就是关于css如何控制某一个div始终位于页面右侧全部的内容,包括:css如何控制某一个div始终位于页面右侧、DIV+CSS怎么才能知道图片的坐标、、div定位在另一个div右边等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)