怎么在登录页面的图片中精确放置输入框

如何在登录页面的图片中精确放置输入框？
如下图的登录图片，图中预留了用户名、密码、确定按钮等位置，请问如何把我的户名、密码输入框精确放到图片的位置中？如果图片在各种分辨率的显示下居中的话，户名、密码输入框的left位置应该是不一样的吧，如何兼容各种分辨率呢？请各位高人指教！


[解决办法]
先把大图的的DIV的css设置为position:relative,再用position:absolute定位一个DIV，最后就在这个DIV中写form表单就是了。
[解决办法]
和分辩率也没啥关系吧! 
背景图片写在body里，background:url(xx.jpg) no-repeat center top
你内容容器，直接写宽度，然后margin:0 auto;这样不就一直在中间的么？

[解决办法]

引用:

将图片置顶，居中，使用DIV可以精确放置输入框和按钮了。
但是我还有一个疑问：
如果图片是800*600，屏幕是1024*768，为美观起见，图片是上下左右居中，即图片的TOP位置是随着屏幕分辨率高度变化的，这样的情况下，DIV如何在不同分辨率下都精确对准输入的位置呢？
DIV能根据屏幕的宽度上下居中吗？

如果找不到别的办法，试一下这个:
定义一个div包含用户名和密码输入，然后用js动态判断div的位置：定义一个js函数响应window.onresize消息，在函数内计算得出页面大小：

        function onresize() //函数：获取尺寸
        {
            var winWidth = 0;
            var winHeight = 0;
             //获取窗口宽度
             if (window.innerWidth)
                   winWidth = window.innerWidth;
             else if ((document.body) && (document.body.clientWidth))
                   winWidth = document.body.clientWidth;
             //获取窗口高度
             if (window.innerHeight)
                   winHeight = window.innerHeight;
             else if ((document.body) && (document.body.clientHeight))
                   winHeight = document.body.clientHeight;
           
             //通过深入Document内部对body进行检测，获取窗口大小
             if (document.documentElement && document.documentElement.clientHeight && document.documentElement.clientWidth)
             {
                 winHeight = document.documentElement.clientHeight;
                 winWidth = document.documentElement.clientWidth;
             }
             
           //***增加自己的处理
       }

因为div大小固定，又上下左右居中，所以可以计算得到div的位置，然后在函数内调整它的位置。

查看更多 下一篇