页面分为三部分,顶部,左边和右边。其中点击左边的超链接,右边的框架页面会相应变化。...5、如何在子页面中获取父页面所在的frameset中的其它的frame中的元素?...taskCreat").attr("class","list-group-item"); 6、frameset 的优缺点 我们知道,目前的 HTML5 标准已经不支持 frameset 了,虽然使用它重载页面时不需要重载整个页面...,只需要重载页面中的一个框架页(减少了数据的传输,加快了网页下载速度)。...但是它也有很多缺点,比如浏览器的后退按钮是没用的;会产生很多页面,不易管理;代码复杂,不易被搜索引擎搜索;小型移动设备显示不全;多框架的页面会增加服务器 http 请求等等。
本篇介绍使用 Qt 设计师创建 主窗口(MainWindow)的大致步骤: 1....创建主窗口的 界面,保存即生成了.ui 的 文件 1.1 新建界面时选择创建 Main Window 1.2 创建菜单 选中Type Here 处 双击(或按 Enter键)编辑菜单名。...用 PyQt5 的 pyuic5 命令将 .ui 文件转化成 .py 文件(参见《使用Qt Designer 设计对话框(二)》篇) 3....先在主程序中导入上一步创建的 py文件中的类 Ui_MainWindow, 接着 以多重继承的方式 (先后继承 QMainWindow、Ui_MainWindow),创建 主窗口子类。...可参见《使用Qt Designer 设计对话框(二)》篇。最后完善其它部件, 如停靠窗口,状态栏的 界面和功能,参见《PyQt 中心窗口、停靠窗口和状态栏》篇。
对于单张页面上的信息排布和节奏并没有太多的感知,只是不知道的时候看看竞品,然后抄抄改改。虽然最后开发出来并没有问题但是总觉得自己没有提高。...现在在部门老大和导师的强行带飞下,发现原来单张页面的信息(框架层)是可以梳理的很清楚,并不断打磨的。...现在归纳一下页面信息设计方法: 1、这个页面要传达什么概念,需要包含什么信息 2、这些信息能被整合成几个大部分,每个部分传递了什么概念 3、这些大部分在页面应该以什么顺序排列才能让用户更好的理解页面想要传达的信息...4、每一个大部分能被分成几个小部分,每个小部分能让用户传递了什么概念 5、这些小部分在页面应该以什么顺序排列才能让用户更好的理解大部分想要传达的信息 6、让自己成为一个一无所知的用户,看进入这个页面后能获得什么信息...,这些信息是不是当时设计时想要传达的 举个例子(还可以继续拆分) 支付宝乘车码 感觉自己每天都在被带飞,每天都有新收获,开心~
一、效果图 image.png image.png image.png 二、前端页面 1、商品列表: reserveCommodityOnShelfList.jsp <%@ page contentType...$("#contentTable tbody tr button").each(function () { $(this).removeAttr("disabled");//页面刷新将所有的
这里先不看细节,即先不管底层数据源是什么数据库,我们先只聊架构方案,因为无论底层是关系型数据库,还是NoSQL数据库,无论是 Mysql 还是 Redis、MongoDB,我们在架构设计上都是相通的。...大体上,单中心双机的常见方案有以下这些: 一主一备的架构(主备式) 一主一从的架构(主从式) 互为主从的架构(主主式) 以上方案从上至下,依次是从简单到复杂,从基础到丰富。...下面我们来具体看看: 一、一主一备的架构(主备式) 主备式架构是双机部署中最简单的一种架构了,几乎市面上所有的数据库系统都会自带这个主备功能。...二、一主一从的架构(主从式) 主从式架构大体上与上述的主备式架构差不多。区别就是主备式的「备机」平时是不干活的的,主要起到备份的作用。...这些细节都是在设计主从自动切换架构时候,要提前规划的。 三、互为主从的架构(主主式) 互为主从的架构是指两台机器自己都是主机,并且也都是作为对方的从机。
本来没有想到会有2的,结果最近的活动让我有了一些新的思考,就赶快梳理一下~ 页面思考信息1主要梳理的是面对一堆信息时如何通过不断的划分后优雅地展示,然而如果信息量本来就超出了用户能够理解的范围该怎么办?...选所在区域 3、公益捐赠 捐赠条件: 当日步数达到1000步时贡献步数即可捐赠0.1元 以下是实际沟通的流程: 1、分析需求 虽然这三个奖励的获得都能通过“贡献步数”这个动作获得,但是这3个事情要在一个活动页面中让用户短时间内理解清楚并不是一件简单的事...4、制作原型 总结 作为交互设计师,接到需求时其实是可以有所控制的,包括信息量、信息之间的关联程度、用户的理解成本等。
这是一个基于BS的页面设计器,通过拖拽和配置就可以实现增删查改功能,适合于各种专注业务的应用场景。配一配程序就开发完了,看图: 页面设计器 原文地址
在前面的技术文章中已经很系统的介绍了UI自动化测试的技术栈的知识体系,但是在维护的成本而言还是需要考虑进一步的优化,那么我们可以使用页面对象设计模式,它的优势具体可以总结为如下: 创建可以跨多个测试用例共享的代码...减少重复代码的数量 如果用户界面发生了维护,我们只需要维护一个地方,这样修改以及维护的成本相对而言是比较高的 目录结构设计 下面我们具体针对这部分的目录进行设计,具体的目录结构为: 下面我详细的解释下每个目录的是干什么的...下存放的主要是工具类的代码,比如针对JSON文件,YAML文件的处理 common下主要存放的是公共类的代码,比如文件目录的处理 data主要存放测试过程中使用到的数据 report主要存储的是测试报告这部分 页面对象设计模式...上面已经很详细的解释了页面对象设计模式它的优势,以及目录结构的设计,下面依次来实现各个部分的代码。...,引人工厂设计模式后,这对基础层的代码进行完善,完善后的代码为: #!
版权声明:本文为博主原创文章,未经博主允许不得转载。...article/details/71750893 背景: 每个网站开发中,多多少少会需要一些默认的配置项,相对而言一条条的手动添加是极为繁琐的,要分类各种图片、文字、文件、单选、多选按钮等,在此提供一种设计思路...一.数据库设计 1.数据库设计截图 ?...二.前端设计 1.添加页面展示 ? ? 2.核心代码参考 ?...五.附录 1.补录 可建议自行添加配置项排序功能 如果时间允许,建议将不同类型的配置项进行剥离处理,方便统一页面设计,美观适用性增强。 2.源代码下载 >>>
页面重构中的设计模式 由 Ghostzhang 发表于 2014-07-02 02:40 查了下最开始的创建日期,竟然是2011年12月19日,这文章断断续续写了快3年,终于了算比较完整了,但可能相对还是写得有些简单了...本地下载PDF 页面重构中的设计模式 from Ghost Zhang 以前写过的系列文章《 前言——页面重构中的设计模式 》,可以帮助理解,但需要注意的是,因为这期间有些想法上的变法,可能一些细节会不太一样
表单中的一切元素均左对齐 尽管新的设计占据了更多的垂直空间,但是标签/字段组却显得更加清晰。用户能够直接自上而下地扫视信息,而不必从左到右再循环往复。...预填充关联字段 一些细节记录页面都包含「发布器/publisher」,允许用户快速记录号码或创建新任务/活动。比如下面这张表单: ? 通过发布器记录号码 ?...为了解决这个问题,我们设计了一种折衷方案:系统会根据上下文预先填充某些关键信息。这样做就能够扫除填写表单时的潜在障碍,因为用户需要填写的字段从4个变成了2个。...键盘友好型&易用性 全新的 Lightning Experience 设计初衷就是更加容易使用。用户只使用键盘,就能够进行编辑和更改任何字段。
一、功能测试用例设计: 1、正常登录场景 测试用例1:输入正确的用户名和密码,验证用户能否成功登录并跳转到主页面。...3、响应时间测试 测试用例12:测量从用户输入用户名密码到成功登录页面加载完成的时间,确认是否满足性能要求。...四、兼容性测试用例设计: 1、跨浏览器兼容性 测试用例18:在主流的浏览器(如Chrome、Firefox、Safari、Edge等)中进行登录操作,验证页面布局、功能及表现一致性。...测试用例21:测试横竖屏切换时,登录页面元素的位置调整和功能正确性。...十九、用户权限管理测试用例设计: 测试用例46:对于拥有不同角色和权限级别的用户,在登录后验证其能否访问对应的权限资源,以及对无权访问的页面或功能是否进行了有效拦截和提示。
每一个网站都必须有404页面,404页面指的是显示网站错误链接的页面,可能是该访问的页面不存在,也可能是页面已经被删除。...设计404页面 Jacob Nielsen在十大可用性设计原则中曾提到: 帮助用户识别、诊断错误,以及解决错误:错误信息应以简单平实的语言(无代码语言)来表示,准确指出问题,并建设性地提出解决方案。...践行这个原则可以考虑到以下几点: 404页面的设计一定要与网站风格一致,不然会让用户感觉进入另一个网站,会立马关闭网页。...可以使用简洁明了的幽默文字或者动画,趣味性的引导用户返回上一级或者进入网站首页和其他页面。 不能直接把404页面指向首页,这种很容易让搜索引擎误认为多个重复页面,不利于优化。...---- 其实,404页面出现主要原因是无法满足用户的需求,用户无法得到自己所想要的东西而出现了404页面,所以404页面是一个值得重视的页面,不仅需要为每一个网站设置404页面,并且在其页面中要表达出对用户的歉意
页标题的设计 图一中的页标题设计非常经典:公司logo+竖线+报告名称。字体/字号/颜色的变化显得很活泼,同时采用深色主题色反衬以达到醒目的效果。...图一 第一届Power BI可视化大赛获奖作品—Project Progress Tracking System 图二的页标题设计与图一类似,但行宽字体都要大号一些,所以页标题行成为这个页面的强调重点。...背景色的设计 通常黑色系的背景会让报告显得很高端,很专业,如图一。但这绝不是简单随意的选个纯黑就可以了,不信你试试,一个随意的纯黑背景照样会很LOW。...图表元素越少越好 这里的图表元素是指网格线,边框,数据标签,甚至坐标轴,如果可以不用就不用,当然前提是不影响信息传递,如果非要用可以把颜色调的浅淡一些,这样整个页面会显得很简洁进而进一步突出重点。...创建导航页 相对于直接进入报告页,并利用页标签切换,创建导航页进行页面切换要专业美观很多,如图四、图五。
分析设计: 背景和要求都介绍清楚了,下面我们来分析一个这个页面, 刚刚拿到这个页面设计图的时候真的是一脸懵逼,多个表格嵌套还不算难,但是点击表格中编辑操作在此条记录下显示编辑的表单,这个要怎么实现.因为每条记录都是用...当时我的内心是一万个拒绝的.但是,但是,但是.....我没有当面拒绝而是先默不作声,会后再下去搜索资料,分析方案.虽然产品的要求很奇葩,而且这样设计也可能有很大风险,比如,页面逻辑不清,操作复杂,用户不会操作...接下来开始设计数据结构,别慌在这之前我想先谈一下前端数据驱动的页面设计 数据驱动: 关于数据驱动有的人解释为:当数据发生变化的时候,用户界面发生相应的变化,开发者不需要手动的去修改dom 相比以往jquery...那种拿到数据后再使用选择器,操作dom的方法渲染页面,数据驱动有很好的扩展性和效率,要想改变页面,直接操作数据,多一条,少一条都可以直接在页面上反应出来.这也是得益于目前前端框架的飞速发展.这种数据驱动的方法解放了前端开发人员的双手...数据结构: 根据分析我设计的页面的大致数据结构为 const FAList = [] // FA表单列表对象 const TATable = [ { // 正常tr对象 formItem:
前端的中后台管理系统相比于其他普通项目,从开发设计的角度来说有几点比较特殊: 一个是权限设计,具体实现可参考:传送门。 一个是页面布局的设计,也是本文要说的。...一个好的页面布局设计,无论是对于页面结构的稳定性,还是功能拓展的方便性,亦或是用户体验上,都有着重要的作用。 一、市面参考 先来看看市面上的一些优秀的开源系统项目的页面布局。...文本就围绕这种布局结构来设计。...三、css布局 良好的css布局代码才能保证页面布局的稳定性。 而对于整体布局来说,flex是首选,稳定性更好,不兼容ie9。...height: 100%; overflow: auto; padding: 15px; // 内容区域可以在这里统一设置下边距 } } c-PageLayout-index 页面整体容器
</LinearLayout </LinearLayout 真个页面最大的难点就是这个自定义的布局文件:ScrollViewContainer 不过非常爽的就是大家不用自己写,直接从demo
Elementor是一款非常流行的WordPress页面设计插件,它可以帮助用户轻松地创建漂亮的网站页面。在本教程中,我们将介绍如何使用Elementor来设计一个页面。...第三步:选择一个模板 在Elementor页面编辑器中,您可以选择一个模板来开始设计您的页面。Elementor提供了许多预制模板,您可以选择一个适合您的网站的模板。...第五步:保存页面 完成页面设计后,您需要保存页面。您可以点击页面编辑器右上角的“更新”按钮来保存页面。如果您想预览页面,可以点击“预览”按钮。 第六步:发布页面 最后,您需要将页面发布到您的网站上。...您可以点击页面编辑器右上角的“发布”按钮来发布页面。一旦页面发布成功,您可以在网站上查看它。 总结 Elementor是一个非常强大的页面设计插件,它可以帮助您轻松地创建漂亮的网站页面。...在本教程中,我们介绍了如何使用Elementor来设计一个页面。希望这个教程对您有所帮助。
这也是不少企业在网站中使用常见问题页面的原因。 那么如何才能设计好FAQ页面呢?这就是本文将要介绍的内容。...FAQ页面设计包括3方面: 一是FAQ导航按钮的设置 一般安排在主页的右上角,和语言选择等在一起,此外最好在注册成功能展示页面安置FAQ按钮,以便于用户发现,同时可以把FAQ的导航按钮设计为与其他导航不一样的开关和色彩...FAQ页面设计要素 1.写清楚简洁的页面 在FAQ页面方面,“越多越好”实际上是一种谬误。太多的文字最终会让人感到困惑,导致读者不得不寻找他们需要的答案。...通常最好坚持基本格式和简单的设计,可以快速访问和轻松阅读。 在制作您自己的常见问题页面时,这些提示可以为您提供结构。有关设计过程的更多指导,请查看以下创建成功FAQ页面的公司。...如何构建常见问题(FAQ)页面 FAQ作为网站整体设计的一部分,他需要是一个单独且完整不应该是事后的想法,也不应该是设计不良的网站的解决方案。
领取专属 10元无门槛券
手把手带您无忧上云