登陆页面上的浮动表单

Question

我需要构建一个受此启发的登陆页面：

但是我无法弄清楚表单是如何漂浮在背景上的？基本上 div 标签是如何在这个设计中制作的。有人对此有任何线索吗？

Answer 1

尝试使用浮动表单容器

     .floatingform {
        position:fixed;
        right:0px;
        z-index:2;
        height:300px;
        width:200px;
        background:green;
        }

Answer 2

设计登陆页面时，影响转化率以及因此影响登陆页面设计价格的关键要素之一是浮动表单的使用。当用户滚动浏览您的登陆页面时，浮动表单仍然可见且可供用户访问，从而增加了他们与表单互动的可能性。

要在登陆页面上创建浮动表单，您可以使用CSS属性，例如position:fixed;和 z 索引。这是一个简单的例子：

.floatingform {
    position: fixed;
    right: 0px;
    z-index: 2;
    height: 300px;
    width: 200px;
    background: green;
}

位置：固定；属性确保即使用户向下滚动页面，表单也保持在同一位置。右边：0px；属性将表单定位在屏幕的右边缘。 z 索引：2；属性确保表单位于页面上其他元素的顶部。 height 和 width 属性定义表单的大小，背景：绿色；属性设置表单的背景颜色。