CMSdede后台登陆界面设计

1 在这里我就公布 css 和jq  也就是dede文件下templets的login.htm页面：代码如下 

    $(function () {

            $(".text").hover(function(){

                    $("#body").css("background","url('/szlx/images/body6.jpg')");

                } ,

                function(){

                    $("#body").css("background","url('/szlx/images/body2.jpg')");

                }

            ) ;

            $(".alltxt").hover(function(){

                    $("#body").css("background","url('/szlx/images/body4.jpg')")

                } ,

                function(){

                    $("#body").css("background","url('/szlx/images/body2.jpg')");

                }

            ) ;

            $(".yzm").hover(function(){

                    $("#body").css("background","url('/szlx/images/body7.jpg')")

                } ,

                function(){

                    $("#body").css("background","url('/szlx/images/body2.jpg')");

                }

            ) ;

    })

 

css代码：

#login-box{ background:rgba(0,0,0,0); margin-top:280px; margin-left:650px; color:#ececec; border:0; } .text{ width:200px !important; height:30px !important; margin-left:180px !important; margin-top:25px !important; border:1px solid #ececec !important; background:rgba(0,0,0,0) !important; border-radius:20px !important; color:#ffffff !important; text-indent:10px; font-size:15px !important; transition:all 1s !important; } .alltxt{ width:200px; margin-left:180px !important; height:30px !important; margin-top:25px !important; background:rgba(0,0,0,0) !important; border:1px solid #ececec !important; border-radius:20px !important; text-indent:10px !important; color:#ffffff !important; font-size:15px !important; transition:all 1s !important; } .login-btn{ width:210px !important; margin-left:178px !important; height:40px !important; margin-top:25px !important; background:#2a52ff; border:0 !important; border-radius:20px !important; color:#ececec !important; font-size:15px !important; transition:all 1s !important; } .login-btn:hover{ background:#7400ff; transition:all 1s; border:0 !important; } .text:hover{ border:1px solid #00ff4b !important; transition:all 0.2s; color:#00ff4b !important; background:rgba(0,0,0,0.4) !important; } .alltxt:hover{ border:1px solid #00ff4b !important; transition:all 0.2s; color:#00ff4b !important; background:rgba(0,0,0,0.4) !important; } .login-btn:active{ background:#7400ff; transition:all 1s; border:0 !important; } .hydl{ color:#ececec; font-size:21px; margin:auto; margin-top:20px; text-align:center; transition:all 1s !important; } .yzm{ width:220px; margin-left:180px !important; margin-top:25px !important; } .yzm input{ height:30px !important; width:200px; border-radius:20px !important; text-indent:10px !important; background:rgba(0,0,0,0) !important; color:#ffffff !important; font-size:15px !important; transition:all 1s !important; border:1px solid #ececec !important; } .yzm img{ margin-left:-85px !important; position:absolute !important; background:rgba(0,0,0,0) !important; margin-top:6px; } .yzm input:hover{ border:1px solid #00ff4b !important; transition:all 0.2s; color:#00ff4b !important; background:rgba(0,0,0,0.4) !important; } .login-main{ background:rgba(0,0,0,0.0) !important; } dl{ background:rgba(0,0,0,0.0) !important; }

2 上面的代码直接复制进去之后 在dede文件下打开images文件在里面放入你想要的背景图，然后再jq代码中改你放进去的名字同时body他有默认的背景如果需要你也可以跟换

---恢复内容结束---