手机号/邮箱:?
使用第三方登录：?
还可以输入 300 字符
请输入举报理由
选择收藏分类：
默认收藏夹
添加收藏分类：
原创作品：2.0网页部分设计界面
系统分类：
作品版权由
解释，禁止匿名转载；禁止商业使用；禁止个人使用。 临摹作品，同人作品原型版权归原作者所有。
中国 / GUI设计师251天前发布
中国 / GUI设计师251天前发布
同时推荐此作品
还可以输入2000 个字符
所有，禁止匿名转载；禁止商业使用；禁止个人使用。您的当前位置： >
魔龙与勇士设置系统界面功能详解
来源：作者：吃猫的鱼
魔龙与勇士设置系统界面功能详解，在游戏的主界面中有一个设置功能，对于这个按钮大家是都有仔细的了解过呢，今天小编就来为各位小伙伴仔细讲解下这个功能，下面就随我们一起去看看这个设置按钮吧。
首先我们打开之后就尅有看到有好多的ON啊，这是游戏中所有的效果设置集结界面，大家可以看到有音效、音乐、送爱心、好友请求显示设置、缓存，退出登入、推送设置、切换角色、意见反馈等等。每一个按钮都有着自己的作用，其中音效、音乐差不多，当开启之后就可以放背景音乐，其他功能都是通过YES和ON来控制的。&-&&-&&-&&-&自定义wordpress登录界面
远方的虽然设置了前台登录，但偶尔也会从后台界面登录，有时为客户做了一些网站不需要集成这一功能，所以看的久了，难免产生视觉疲劳。
而后台登录界面也没有自定义的功能设置，虽然有插件可行，但总是不想用插件。
方法其实很简单，向添加函数，然后调用即可，就两部分代码，而界面的设计就靠个人的感觉。
添加之前，我们在主题目录下的includes文件夹（或者主题根目录下，只要函数中调用CSS样式的路径正确就可以）下新建一个存放自定义后台界面的样式和图片的文件夹login，方便以后再次利用。
function custom_login() {
echo '&div id="header"&
&div&&a href="'.get_home_url().'" title="'.get_bloginfo( 'name' ).'" class="logo_c"&&/a&&/div&
&div id="topmenu"&
&a href="'.get_home_url().'" title="'.get_bloginfo( 'name' ).'"&'.get_bloginfo( 'name' ).'&/a&
&div id="salong"&
&div id="sll"&
&h1&'.get_bloginfo( 'name' ).'&/h1&
&p&'.get_bloginfo('description').'&/p&
&div id="footer-bottom"&
&div id="footer-bottom-container"&
&div class="sleft"&Copyright © 2013. &a href="'.get_home_url().'" title="'.get_bloginfo( 'name' ).'"&'.get_bloginfo( 'name' ).'&/a&.版权所有&Design by &a target="_blank" href="https://yfdxs.com"&萨龙龙&/a&&/div&
&div id="login_n"&&/div&
&div id="loginBg"&&/div&
add_action('login_body_class', 'custom_login');
function fixed_login() {
echo '&link rel="stylesheet" tyssspe="text/css" href="' . get_bloginfo('template_directory') . '/includes/login/login.css" /&'; }
add_action('login_head', 'fixed_login');
第二部，在函数中调用的样式文件login.css中添加如下代码（样式做了更改，把之前隐藏的登录界面中的返回站点、注册与忘记密码三个按钮显示出来）：
#header { background:#fff; height:48px; width: 100%; box-shadow:2px 2px 5px #333; position:relative; z-index:999; }
body.login { -webkit-text-size-adjust:none; background:url(login_bg.jpg) no-repeat; font-family: Verdana,sans-serif; background-size: }
.logo_c{ background:url(logo_h.png) no-repeat; display:block ! float:left; width:40px; height:40px; margin:4px 16px; }
#topmenu { float:rightright; margin:12px 20px 0 0; width: auto; display:block}
#topmenu a { color: #000; text-decoration: none; }
#topmenu a:hover { color:#f60; }
#salong { height: 120px; margin: 0 auto; width: 960px; padding: 0; }
#sll{ padding-left: 420px; padding-top: 65px; }
#sll p,#sllh1 { margin-left:-320px; color:#fff; line-height:32px; }
#sll h1 { letter-spacing:8px; width: 320px; }
#sll p { letter-spacing:2px; font-size: 14px; width: 420px; }
#wp-submit { border:none; display:inline-block; height:26px; line-height:26px; padding:0 12px; font-size:12px; color:#fff; min-width:48px; text-align:center; border-radius:2px}
#wp-submit { background-color:#1E7BB3; background-image:-webkit-linear-gradient(top, #3999D2, #1E7BB3); background-image:-moz-linear-gradient(top, #3999D2, #1E7BB3); background-image:-ms-linear-gradient(top, #3999D2, #1E7BB3); border-bottom:1px solid #02598E; cursor:pointer; }
#wp-submit:hover { background:#3275a8; color:#fff}
.login form .input:focus, .login input[type="text"]:focus { border-color:#3999D2; box-shadow:0 0 3px #1E7BB3}
#footer-bottombottom { background:#000; opacity:0.8; border-bottom: 8px solid #FFFFFF; clear: both; color: #999999; height:40px; position: fixed; width: 100%; z-index: 100; bottombottom:0; line-height: 32px; }
#footer-bottombottom-container { margin: 0 auto; width: 960px; overflow: hidden; padding: 0; position: relative; z-index: 100; }
.sleft { color:#ccc; text-align:center; }
#footer-bottombottom a { color:#ddd; text-decoration:none}
#footer-bottombottom a:hover { color:#f90; }
#login { overflow:hidden; position:relative; z-index:999; rightright:220px; padding:0; float:rightright; }
.login form { width:240px; float:rightright; background:none; border:none; box-shadow:none; padding: 8px 24px 12px; }
.login h1 a { background: url(logo.png) no-repeat; float: left; height:56px; position: relative; width:175px; display:none}
.login #nav, .login #backtoblog { text-shadow: none; margin-left: 42px; }
.login #nav a, .login #backtoblog a{ color: #fff ! text-decoration: none; }
#loginBg{ background:#000000; height: 500px; opacity: 0.6; position: absolute; rightright:220px; top: 0; width: 287px; z-index: 99; }
#login_n{ background:url(login_n.png) no-repeat; height:93px; position: absolute; rightright:280px; top:46px; width:168px; z-index:999; }
#user_login,#user_pass,.login form .input, .login input[type="text"]{ background:none; color:#fff; border:1px solid #3999D2; font-size:18px; }
#login_error,.message{ width:240px; float:rightright; margin:0 8px; background:none ! border:none ! color:#f00; margin: 0 12px 12px 8px ! }
#login_error a,body, #wpbody, .form-table .pre, .ui-autocomplete li a,.login label{ color:#fff; }
本文由 远方的雪山 作者： 发表，转载请注明来源！
积分：24970
一个平平常常的人，热爱生活、旅行和摄影，骑行去过西藏，一直计划再去。14年从江西骑行来到大理，现栖居于洱海边，食人间烟火，过简单生活，做简约设计！
最赞的文章
用户名，邮箱或手机网站建设“关于我们”页面设计
&毋庸怀疑，公司网站给与客户的第1印象很关紧，网站的每一个页面都有它的效用和意义，一般网站都会在导航栏设置栏目页面&关于我们&还是&结合我们&以便客户需求帮忙时可以更加迅速方便地理解并找到我们，由此这个页面的预设将会影响到公司形象。下边龙兵采编分享几个走心又走肺的&关于我们&页面的预设。
网站建设对于这个页面的预设要想冒尖公司的个性化独特的地方，展出独有的风格吸引住用户，并让它们快迅速地记录下来住你，页面可以从调配颜色、图片、排字、动效等方面施行开始，成功实现不同一般的的页面风格建设。
1、运用胆量大的调配颜色方案
不一样的调配颜色方案是风格表现出来最直接的一种形式，能够彰显公司性情，调配颜色可以是胆量大的亮色系，也可以是不张扬的冷暖系，还可以是相差很远较大的亮色与暗色互相接合等。
如下所述页面以经典黑白的颜色配搭亮色系的黄色，让页面的绍介看起来十分锐利，冒尖点更加表面化，用户浏览起来更加惹眼，特别利用黄色标记重点内部实质意义，能够引重新任用户的注意，整个儿网站页面富裕质感。
额外，还有点活泼风格的调配颜色方案，利用色彩营建出公司活泼的分为，渲染的是积极上进的公司形象，加上内部实质意义的解说，清楚地向用户奉达了公司网站的正题。
2、个性化图片的使用
&关于我们&页面一般是用来绍介公司事情状况的模块，企业的规模，业务，架构等等都是给用户奉达的重点信息，因为这个，可以认为合适而使用个性化的团队头像来对公司的团队事情状况施行绍介，这么能让用户感受更加真实亲切，比如一个网站建设的企业，用户虽然想明白地理解到公司的预设师有经验，建站水准等事情状况，那末经过对一点重点觉得的绍介，则可满意用户需要。
3、页面的排字预设
排字预设也是对页面萌生关紧影响的因素之一，有点&关于我们&页面的排字过于没秩序，用户在浏览时找不到重点信息，则会萌生烦躁不安的情绪感，对于网站的用户体验认识导致不好影响，同特殊情况减低用户对公司的相信感。与之相反，假如排字有序，细节上严明要求，那末则会带给用户美感。
如下所述以对称效果为主要的排字风格，带给用户的第1印象则是齐楚简洁。
4、网站动效页面的非常奇妙效用
页面接合多电视台方式，特别是网站建设中&关于我们&这个页面临公司的展览，经过动画的页面方式表现出来具有活力的效果，还是视频文件、影音等等，指导用户由不得自己地走进你的公司，让人感受更加真实。
网站建设做好&关于我们&页面就像是给公司的一身装束，能够让用户从力道外更多地理解到公司的事情状况，在一定程度上对公司有推销效用，同时能够更加直接地建造起与用户之间沟通的桥梁，因为这个，现时这个页面亦遭受越来越多公司的看得起。