03 2018 档案
摘要：目录： 设计模式六大原则（1）：单一职责原则 设计模式六大原则（2）：里氏替换原则 设计模式六大原则（3）：依赖倒置原则 设计模式六大原则（4）：接口隔离原则 设计模式六大原则（5）：迪米特法则 设计模式六大原则（6）：开闭原则 设计模式六大原则（1）：单一职责原则 定义：不要存在多于一个导致类变更
阅读全文
摘要：关于设计模式的六大设计原则的资料网上很多，但是很多地方解释地都太过于笼统化，我也找了很多资料来看，发现CSDN上有几篇关于设计模式的六大原则讲述的比较通俗易懂，因此转载过来。 原作者博客链接：http://blog.csdn.net/LoveLion/article/category/738450/
阅读全文
摘要：系统学习已有一段时间，越学习越发现构建思考主场，建立知识体系的必要性。 生活在这个信息大爆炸的时代，信息量呈几何倍数增长。得到、喜马拉雅、有书、TED等各种app争抢着我们的注意力。现代社会，企业竞争的是消费者的时间，一天24小时，企业不仅需要与同行业竞争，甚至要与其他所有行业竞争。 正因为人们有了
阅读全文
摘要：TCP建立连接为什么是三次握手，而不是两次或四次？ TCP，名为传输控制协议，是一种可靠的传输层协议，IP协议号为6。 顺便说一句，原则上任何数据传输都无法确保绝对可靠，三次握手只是确保可靠的基本需要。 举个日常例子，打电话时我们对话如下： 对应为客户端与服务器之间的通信： 于是有了如下对话： 我：
阅读全文
摘要：uiw-iconfont v1.2.6 已发布，uiw-iconfont 是从 uiw 组件库抽离出来的图标字体，基于 svg 图片生成的图标字体。 更新内容 新增 map android-o dashboard table qrcode printer barcode 等7个图标. 新增 map
阅读全文
摘要：一、写在前面 日常生活中，我们经常看到到一个网站时，需要登录的时候，都提供了第三方的登录，也就是说你可以使用你的微信，QQ,微博等账号进行授权登录。那么这个认证登录的东西到底是什么呢？ 微信授权登录页面 或者说你实现这样的授权登录，该怎么做呢？我觉得思路： 首先是登录的网站时，去在第三方登录后，第三
阅读全文
摘要：Logo设计的思路多种多样，但是我个人从Logo设计的历史上，大致可以归纳出五种常规思路，思路的名称是自己编的，仅供大家参考。而列举的这些思路背后，都是有着各自的时代背景的。 先从历史最悠久的一种设计思路开始说，这个思路可简称为实物（象征）法。这种思路设计出来的logo，都有一个特点：就是logo描
阅读全文
摘要：什么是控件？什么组件？ 组件控件分类可以根据组件控件属性进行分类，也可以根据组件控件的功能进行划分。一般按功能划分，例如表单类就可以划分为：单文本输入，多文本输入、日历时间选择器、下拉选择列表、单选多选等。 控件（Control）：单一元素组合而成。 组件（Component）：组件为多个元素组合而
阅读全文
摘要：作为新一代移动端应用分发入口，小程序的趋势明朗化，竞争也在急剧激烈化。战线从手机 QQ、QQ 浏览器、支付宝、手机淘宝，华为，小米等九家手机厂商推出“快应用”，再拉到了谷歌的 Instant App 和 PWA、Facebook 的 React Native。一场围绕webapp关键战役已经全面打响
阅读全文
摘要：说明: 首先,你需要注册一个 github 账号,最好取一个有意义的名字,比如姓名全拼,昵称全拼,如果被占用,可以加上有意义的数字. 本文中假设用户名为 chenqiufei 1. 注册账号 地址: https://github.com/ 输入账号、邮箱、密码,然后点击注册按钮. 图1 第1步 2.
阅读全文
摘要：今天为大家带来的三款软件分别是：Bandicam、Icecream Screen Recorder、Apowersoft Screen Capture Pro。好了，话不多说，咋们赶紧介绍吧。 一、Bandicam（班迪录屏） Bandicam (班迪录屏)是我个人认为目前最强的录屏软件 ，一款由韩
阅读全文
摘要：要完成漂亮的设计，一定要掌握 PS、AI、Sketch 等专业的做图工具才可以。其实，现在有很多网站可以帮助不会专业设计工具的我们，做出很多很漂亮的设计，完成自己的设计需求。今天，我们就来介绍一下这些网站。 原型设计 STUDIO https://studio.design/ STUDIO 是由日本
阅读全文
摘要：写在前面 刚刚开源的mpvue引起了不少前端er们的注意，下图是一个简单的对比。 话不多说，我们现在感受一下如何使用mpvue开发小程序。(以下内容参照mpvue文档完成)、 开发环境 node npm：这里建议安装淘宝镜像 微信开发者工具 node npm：这里建议安装淘宝镜像 微信开发者工具 操
阅读全文
摘要：一、什么是异步？ 我们一般喜欢把异步和同步、并行拿出来比较，我以前的理解总是很模糊，总是生硬地记着“同步就是排队执行，异步就是一起执行”，现在一看，当初简直就是傻，所以我们第一步先把这三个概念搞清楚，我不太喜欢看网上有些博客里很含糊地说“xxxx是同步，xxxx是异步”，还有举什么通俗的例子，其实对
阅读全文
摘要：一、HTTP HTTP（超文本传输协议，HyperText Transfer Protocol)是应用层的协议，目前在互联网中应用广泛。 它被设计用于Web浏览器和Web服务器之间的通信，但它也可以用于其他目的。 HTTP遵循经典的客户端-服务端模型 ，客户端打开一个连接以发出请求，然后等待它收到服
阅读全文
摘要：我们先来看个效果图（chrome下）： 从上面的图可以很明显地看出Chrome下css设置字体大小为12px及以下时，显示的都是一样大小，都是默认12px； 那么网上有一个方法就是给当前样式添加Chrome私有属性：-webkit-text-size-adjust:none; 可是我进行验证后发现并
阅读全文
摘要：众所周知为兼容所有浏览器，有的CSS属性需要对不同的浏览器加上前缀，然而有时添加一条属性，需要添加3~4条类似的属性只是为了满足浏览器的兼容，这不仅会增加许多的工作量。 What is AutoPrefixer Autoprefixer是一个后处理程序，你可以同Sass，Stylus或LESS等预处
阅读全文
摘要：CSS字体处理中最复杂的部分是字体系列（font-family）匹配和字体加粗(font-weight)匹配，其次是字体大小(font-size)的计算。 一、 字体系列 相同的字体可能有很多不同的称呼。例如，你可能对字体Times很熟悉，不过，Times实际上是多种变形的一个组合，包括TimesR
阅读全文
摘要：在我们的项目中有用到: fetch 有直接用的，也有自己封装之后用的; vue-resource 在vue1的时候使用，把方法抽象出来后，总需要往方法里传 this.$http ,感觉是个超级不爽的设计，在vue2的时候弃用； Axios 这是一个非常棒的设计，它是借用angularJs的http
阅读全文
摘要：一. 可读性强的命名 命名是提高代码可读性的第一步，也是极其重要的一步，不仅在js里要命名变量名、函数名，还要在CSS里给命名class、id，给图片命名。好的变量名要完全、准确地描述出该变量所代表的事物。下面是一些命名的规则： 以问题为导向 一个好记的变量名反映的通常都是问题，而不是解决方案。一个
阅读全文
摘要：在开发过程中,我们向服务端发送请求,一般会使用三种方式, XMLHttpRequest(XHR)，jQuery实现的AJAX，Fetch ,让我们首先来比较一下这三者的使用示例。 XMLHttpRequest var xhr; if (window.XMLHttpRequest) { // Mozi
阅读全文
摘要：摘要 web性能的终极目标是减少资源到客户端的延迟,但是我们在HTTP1.0/HTTP1.1协议中经常会遇到加载的图片太多或者太大导致页面加载完成慢的问题:图片太多导致向服务器请求的次数太多,图片太大导致每次请求的时间过长. 本篇将针对图片太多或者太大总结几种优化方案. 一.当图片太多时 方案一:将
阅读全文
摘要：摘要 详细讲述微信H5页面调试（安装在安卓或iOS手机上的），钉钉内H5页面的调试，QQ、微博以及各浏览器上H5页面的调试方法 背景 大学毕业快要一年了,用leader的话说我也是有一年开发经验的前端开发工程师了,输出是检验输入的最好方法,那我就慢慢来总结这一年来在工作中总结的经验教训,分享给大家,
阅读全文
摘要：基础知识 MINA 框架 为方便微信小程序开发，微信为小程序提供了 MINA 框架，这套框架集成了大量的原生组件以及 API。通过这套框架，我们可以方便快捷的完成相关的小程序开发工作。 MINA 框架提供了自己的视图层描述语言 WXML 和 WXSS，以及基于 JavaScript 的逻辑层框架，并
阅读全文
摘要：一、「程序秀」 「程序秀」这个小程序非常特别，因为它是一个可以帮助别人开发小程序的小程序。它以「即速应用」这个无需代码一键生成微信小程序的开发工具为基础，为广大开发爱好者提供小程序开发的最新资讯和培训课程，因此短短的时间里迅速在业内普及开来。功能实用性上，它同时满足了两种人群的需求：完全不懂技术的小
阅读全文
摘要：本案例实现动态显示城市天气的功能，案例效果如下： 首先分析制作的思路： 1.在app.json文件的pages数组里加上main文件夹和template（模板）文件夹的路径。 2.在main.js文件中，在onLoad()函数中调用loadInfo()函数。 3. 自定义获取位置的函数loadInf
阅读全文
摘要：小程序使用的是微信自己开发的MINA框架，提供了试图层描述语言。MINA框架中的四种类型的文件： .js文件-基于JavaScript的逻辑层框架 .wxml视图层文件-是MINA设计的一套标签语言 .wxss样式文件-用于描述WXML的组件样式 .json文件-配置文件，用于单个页面的配置和整个项
阅读全文
摘要：小程序的媒体组件主要包括图片组件（image）、音频组件（audio）、视频组件（video）。通过这些最贱可以控制图片、音频和视频在页面上的显示方式以及加载播放的进程。 image组件是图片引用组件，和HTML语言中的<img></img>类似，具有一系列的裁剪和缩放的属性。 image组件属性以
阅读全文
摘要：第一步：注册 在微信公众平台官网首页，点击注册。（相关文档可以找到，这里不再累述，望见谅。） 微信小程序注册成功后界面 第二步：编辑器、开发工具 我们假定你已经申请注册好微信小程序了，我们选定一个代码开发的编辑器。 这里，我推荐用：Sublime Text或者 Visual Studio Code。
阅读全文
摘要：本篇文章主要讲述3个方面的内容，如下： 1、SSL证书的获取 2、服务器 Nginx SSL 证书的配置。 3、如何兼容80端口和443端口以及为什么要同时兼容这两个端口。 1、SSL证书的获取 https 是微信小程序官方规定的，必须实现服务器的https 访问。那么就涉及到SSL证书了。目前市场
阅读全文
摘要：微信小程序开发计算器有多种方法，但是大部分代码比较复杂、不容易理解。本案例进行了改进，主要是组件bindtap属性绑定的自定义函数clickBtn()，采用了switch语句，使得代码结构更加清晰，学习者更容易理解，现分享如下。案例的效果如下图所示： 制作步骤如下： 1. 在微信开发者工具的全局控制
阅读全文
摘要：实现效果 先来个效果图 效果图 3：项目结构 结构 4：小程序配置 使用app.json文件来对微信小程序进行全局配置，决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。 { "pages":[ "pages/index/index" ], "window":{ "backgrou
阅读全文
摘要：一、开发前准备 1）准备一个服务器，一个已经备案的域名（小程序开发必须使用：https） 2）涉及到微信支付的，需提前在微信支付商户平台，申请商户号和秘钥 3）如果需要将微信公众号或微信小程序相互打通，需提前在微信开放平台注册账号，并将微信公众号或小程序绑定在一起（此时才会获取到unionid） 二
阅读全文
摘要：第一部分：什么是MVP？什么是MVC？ 1、什么是MVP？ M：数据层（数据库、网络、文件存储等等...） V：View和Activity和Fragment以及它们的子类 P：中介->Presenter（作用：将M层数据和UI层进行关联和交互中介） 2、什么是MVC？ M：单纯Model（Java
阅读全文
摘要：算法一：快速排序算法 快速排序是由东尼·霍尔所发展的一种排序算法。在平均状况下，排序 n 个项目要Ο(n log n)次比较。在最坏状况下则需要Ο(n2)次比较，但这种状况并不常见。事实上，快速排序通常明显比其他Ο(n log n) 算法更快，因为它的内部循环（inner loop）可以在大部分的架
阅读全文
摘要：转自：CSDN--http://blog.csdn.net/cherry_vicent/article/details/42120149 1、javascript是什么 根据用户的一些操作，然后来修改页面上的一些元素、属性等。 （1）HTML+CSS静态页面，JS给页面添加动的效果 （2）网页特效的
阅读全文
摘要：无论是在BAT还是创业小公司，都随时可能接到从0开始的新项目，那么作为负责新项目的主设OR独立设计师，我们应该从何开启工作呢？
阅读全文
摘要：使用Postman模拟HTTP请求 Postman是一款强大的前端调试工具，不管是开发人员还是测试人员都会需要调试接口程序，如RestAPI，此时可以通过向服务器发送不同的HTTP请求来判断接口返回结果是否正确。 Postman有两种使用方式：Chrome插件方式，本地安装方式。本地安装程序更强大，
阅读全文
摘要：本页列出了我发现的与计算机安全，数字取证，事件响应，恶意软件分析和逆向工程以及其他相关主题学习主题高度相关和有用的书籍。这些书从介绍性文本到高级研究作品。尽管这些书中的一些看起来有点过时，但所包含的信息对今天学习的人仍然非常有用，而且大部分信息对于熟练掌握信息安全领域都是至关重要的。 请注意，为了避
阅读全文
摘要：一、Web项目基本原理 现在的web项目大都已经前后端独立开发与部署。 前后端独立开发，一般是前端与后端通过web接口(常见的有RESTful与websocket)文档进行交流。前端开发人员先更具业务需求与实际原型进行ui的编程实现与事件的设计，并通过web接口进行业务数据的增删改查。后端开发人员根
阅读全文
摘要：主要介绍下如何编写简单的php接口，以及使用js/jquery的ajax技术调用此接口。 Php接口文件（check.php）: Js/jquery通过ajax技术调用接口: 这里使用了query中的get方法与接口进行数据交互。
阅读全文
摘要：在UML类图中，常见的有以下几种关系: 泛化（Generalization）, 实现（Realization），关联（Association)，聚合（Aggregation），组合(Composition)，依赖(Dependency)。 UML中类图实例 接口：空心圆+直线（唐老鸭类实现了‘讲人话
阅读全文
摘要：由于前端技术的发展与市场需求的提高，前端开发已经不仅仅是写几个页面那么简单。如何有效的开发、管理一个越来越庞大、越来越复杂的前端项目，成为互联网团队必须要面对的难题。 各种js库、ui库曾经火极一时。现在，前端框架与与自动化构建让前端开发走向正规化开发道路。 gulp,就像java开发中的maven
阅读全文
摘要：现在不少虚拟主机都是使用的cpanel控制面板，由于空间商选用的cpanel版本不同，有的带有定时备份功能，而有的就没有这项功能，需要手动备份。不过，还在绝大部分的cpanel后台都有“时钟守护作业”这个功能——这个功能可以实现定时执行某些指令，对空间进行定时全备份，自然也是可以的。下面，我们就介绍
阅读全文
摘要：一、应用场景 在生产环境中，应用服务器（此文以tomcat为例）不免面临高访问量的压力，相比而言web服务器（此文以apache为例）能够承担更大的并发量。Apache本身带有一些模块，可以完成对应用服务器访问流量分流分压的功能。这里就以apache+tomcat配置负载均衡的方式，实现http与w
阅读全文
摘要：程序员难免要经常画流程图，状态图，时序图等。以前经常用 visio 画，经常为矩形画多大，摆放在哪等问题费脑筋。有时候修改文字后，为了较好的显示效果不得不再去修改图形。今天介绍的工具是如何使用 Sublime + PlantUML 的插件画流程图，状态图，时序图等。这是一种程序员看了就会爱上的画图方
阅读全文
摘要：gulp是前端工程化的工具，它可以对html,css,js等代码和图片进行压缩，也可以对sass和less等预处理语言进行编译，代码部署。gulp学起来简单，用起来方便，大大提高我们工作效率。 这里可以参考CTOLib码库的gulp基本教程 ||《gulp中文网》 安装node.js 因为gulp是
阅读全文
摘要：这50个CSS动画集合可以让你通过使用JavaScript函数来让动画更生动。为了能够预览到这些惊人的CSS3技术带来的动画特效，请大家使用如Safari和Chrome这类基于WebKit内核的浏览器。(IE浏览器谢绝观赏~) 1.CSS3实现钟表效果(基于jQuery) 使用CSS3的基本变形特性
阅读全文
摘要：HTML 5 规范引进了很多新特性，其中最令人期待的之一就是 canvas 元素。HTML 5 canvas 提供了通过 JavaScript 绘制图形的方法，此方法使用简单但功能强大。每一个canvas 元素都有一个”上下文( context )” (想象成绘图板上的一页)，在其中可以绘制任意图形
阅读全文
摘要：HTML5 & CSS3 准备就绪 该网站通过扇形图表的形式展现了从08年到10年以来各大浏览器对HTML5和CSS3的支持情况。发展势头还是很可观的。 HTML5安全手册 CSS3按钮生成器 所见即所得的为你生成CSS3按钮，你仅需通过基本的鼠标点击便可生成令人满意的CSS3按钮，点击生成好的按钮
阅读全文
摘要：注意:这篇文章介绍的 API 尚未完全标准化，并且仍在变动中，在项目中使用这些实验性 API 时请务必谨慎。 引言 现在的 web 严重缺乏表达能力。你只要瞧一眼“现代”的 web 应用，比如 GMail，就会明白我的意思： 堆砌 <div> 一点都不现代。然而可悲的是，这就是我们构建 web 应用
阅读全文
摘要：组件是 Web 开发的方向，现在的热点是 JavaScript 组件，但是 HTML 组件未来可能更有希望。 本文就介绍 HTML 组件的基础知识：自定义元素（custom elements）。 文章结尾还有一则 React 培训消息（含 React Native），欢迎关注。 一、浏览器处理 我们
阅读全文
摘要：Web设计师可以使用HTML4和CSS2.1完成一些很酷的东西。我们可以在不使用陈旧的基于table布局的基础上完成文档逻辑结构并创建内容丰富的网站。我们可以在不使用内联<font>和<br>标签的基础上对网站添加漂亮而细腻的风格样式。事实上，我们目前的设计能力已经让我们远离了那个可怕的浏览器战争时
阅读全文
摘要：我们有三种主要的方法(从难到易):自己动手写脚本;使用类似于jQuery和mooTools的JavaScript框架(可以让编写代码变得更容易些);使用能工作于现有的JavaScript框架下的提前预置好的脚本或那种从头开始开发的创建者。这篇文章适合那些打算提高工作效率或不愿意从头开发脚本的人阅读。
阅读全文
摘要：CSS兼容问题一直困扰着CSSer，面对各浏览器，往往感觉束手无策，愁眉不展。CSS Hack是在标准CSS没办法兼容各浏览器显示效果时才会用上的补救方法，在各浏览器厂商解析CSS没有达成一致前，我们只能用这样的方法来完成这样的任务。 我进行前端开发的时候，测试用的浏览器大致有: IE7、IE6、O
阅读全文
摘要：在这里可发现很多与众不同的技术，比如:图片集、阴影效果、可扩展按钮、菜单等…这些实例都是使用纯CSS和HTML实现的。单击每个实例的标题可以被转向到该技术实例的相关教程或说明页面(英文)，单击每个实例的图片截图可以直接跳转到相应实例的Demo页面。 1.Hoverbox 图片集 一个纯净的基于CSS
阅读全文
摘要：1. A List Apart CSS Topics A List Apart，学习网页设计和最佳实践的首选网站。这个网站从1999年就开始发表关于CSS的文章，其中大部分文章都是面向那些更注重符合标准设计的中级到高级设计师。 2. CSS Help Pile CSS Help Pile汇集了大量的
阅读全文
摘要：层叠样式表(css)是Web设计的一种语言，CSS的下一代版本CSS3已经蓄势待发。你是否可望开始使用它们却又不知从何下手呢？虽然还有一些新属性没有得到官方的确认，但是一些浏览器已经开始支持来自CSS3得新特性了。但问题是——许多浏览器支持了，唯独最主要的Internet Explorer浏览器仍不
阅读全文
摘要：Web服务的一个重要特点就是流量大、数据多，仅靠一台服务器肯定难以支撑大规模的服务。 所以我们经常会看到诸如以下的一些术语，教人好生不懂： *：系统架构、物理架构、Web服务基础设施 *：应用服务器 *：数据库服务器 *：索引服务器 *：反向代理服务器 *：缓存服务器 *：分布式、可扩展性 *：cp
阅读全文
摘要：您正在学习WEB标准CSS网页布局吗？是不是还不能完全掌握纯CSS布局？通常有两种需要您特别注意: 第一种可能是你还没有理解CSS处理页面的原理。在你考虑你的页面整体表现效果前，你应当先考虑内容的语义和结构，然后再针对语义、结构添加CSS。这篇文章将告诉你应该怎样把HTML结构化。 另一种原因是你对
阅读全文
摘要：当我们谈论网站可用性的时候，我们总会提及用户界面(UI)——按钮、标记(label)、标签(tab)等的设计与布局。但是，还有一个可能会被你忽视的元素可能会把你辛辛苦苦设计的网站毁于一旦，那就是(文字)内容。 这些文字内容就是你的网站上用文本方式提及的方方面面，它涵盖了何种类型的文本内容。今天暴风彬
阅读全文
摘要：导航结构在网站设计中是起到决定性作用的，导航菜单/栏常常通过颜色、排版、形状和一些图片来帮助网站创造更好的视觉和感受，它是网页设计的关键元素。虽然网站导航菜单的外观是网页设计中关系到整个设计成败与否的关键，但视觉效果也不能影响到网站可用性。最理想的设计是网站的导航既能比其他网站的导航外观更吸引人，又
阅读全文
摘要：决定一个网站成败命运的，不是视觉设计，而是设计的可用性和有效性。访问网页的用户们握着鼠标，决定一切，“以用户为中心”已然是成功网站的标准设计方向。总之，用户不用的功能，就不该存在。 我们并不打算重复探讨操作细节（比如：“搜索工具栏”应当怎么放置），相反，我们的目光将集中在网站有效设计的核心原则、启发
阅读全文
摘要：过去有很多网页设计师喜欢将他们的网页效果图用table布局实现成网页，但是这样做会遇到一个比较麻烦的问题就是，后期调试和维护会相当的困难。现在，越来越多的前端开发er们开始使用xHTML+CSS替代最初的table布局完成网页的整体布局，不但让网站降低了开发和维护的成本，而且代码也更语义化了。但是，
阅读全文
摘要：前些日子在SmashingMagazine看到一篇关于CSS3新技术不错的文章，它详细介绍了CSS3的新特性和它的使用方法，它包括:浏览器专有属性、选择器(属性选择器、连字符、伪类、伪元素)、RGBA和透明度属性、多栏布局、多背景图、Word Wrap、文字阴影、CSS圆角、边框图片、盒阴影、盒尺寸
阅读全文
摘要：级联样式表(CSS)在当代Web设计中已经成为重要的环节，如果没有CSS现在的网站将像10年前一样不堪入目。随着CSS技术的普及，越来越多的高质量CSS教程涌入互联网，让我们的学习更加方便。 1.CSS跨浏览器幻灯片 演示了如何仅适用CSS打造一个跨浏览器的图片画廊 2.基于CSS的图片地图 这个教
阅读全文
摘要：转自：http://blog.bingo929.com/cheat-sheets-for-web-develop.html Cheat sheet这个词组如果直译成中文，意思大概是”作弊小抄”之类的词，但Cheat sheet这个词的实际意思已经并非是贬义了，虽然中文还没有实际的对应词能够很好的翻译
阅读全文
摘要：现在国内绝大多数的站点都用CSS把字体大小设定为12px，像素虽然也是相对尺寸单位，但只是相对于屏幕的分辨率 ，当屏幕的分辨率一定时，如果你 感到字太小，阅读有困难，在非标准浏览器中就无能为力了，从而降低了用户体验。所以说，如果把单位改成em，那么就可以用CTRL+鼠标滚动把字放大，或者用菜单上的查
阅读全文
摘要：转自：http://blog.bingo929.com/lunascape-firefox-safari-ie-all-in-one.html 作为前端开发/网页设计师，电脑中总是安装着各种不同内核渲染引擎的浏览器，如IE(Internet Explorer)、FireFox、Safari、oper
阅读全文
摘要：转自：http://blog.bingo929.com/css-frameworks-15.html 什么是css框架 实际上还是让我们从框架说起吧。框架就是一个你可以用于你的网站项目的基本的概念上的结构体。 css框架通常只是一些css文件的集合，这些文件包括基本布局、表单样式、网格或简单结构、以
阅读全文
摘要：推荐9款很棒的可在网页中绘制图表的JavaScript脚本，这些有趣的JS脚本可以帮助你快速方便的绘制图表（线、面、饼、条…），其中包括jQuery、MooTools、Prototype和一些其它的JavaScript框架。您还可以参考以下JavaScript/CSS相关教程及资源:《10个非常棒的
阅读全文
摘要：这些网站都会经常更新一些优秀且高质量的Web界面设计教程。如果你热爱网页设计并且经常搜集各种界面设计教程，那么你一定要把下面这些网站收藏起来。 您还可以参考以下网页设计相关教程及资源:《Web UI 设计(网页设计)命名规范》《30个运用纸类元素网页设计的创意实例欣赏》《2008年最佳Web设计/前
阅读全文
摘要：转自：http://blog.bingo929.com/web-design-stars-aurora.html 如果将这种简单的星空或极光设计效果添加到你的网站、博客的背景图或页头中，马上会令富有新的生命力！ 您还可以参考以下Web设计相关教程:《网页设计新趋势:云隙阳光和光线效果》《网页设计趋势
阅读全文
摘要：在设计Web界面的时候，如何确保用户更方便快捷的使用是关键所在。在导航或其他一些地方使用恰当的图标既可以让网页更漂亮又可以提高用户体验和可用性。但是如果每个网站项目都要从头开始创意和设计一套图标的话，会浪费很多宝贵的时间，为什么不使用那些现成做好的图标呢（当然如果项目比较大，那是需要单独设计的。）下
阅读全文
摘要：这50个CSS网站是由WebDesignerWall评选出来的，很具参考价值。我们在欣赏的同时，也能从中吸取很多灵感，也能从它们的源代码中学习更高级的CSS技术。今年，越来越多的设计师开始使用超大的背景图片技术和一些JavaScript框架（如jQuery及MooTools）来提高用户体验。还有一些
阅读全文
摘要：网站可用性是任何网站的基本要素，而可用的导航更是网站所必需的要素之一。导航决定了用户如何与网站进行交互。如果没有了可用的导航，那么网站内容就会变得毫无用处。导航菜单应当足够简单以让用户快速了解它，但还要包含一些必要的元素来引导用户浏览整个网站——融入一些有创意且漂亮的设计。下面的有些是基于CSS设计
阅读全文
摘要：Web UI 设计命名规范 一.网站设计及基本框架结构: 1. Container“container“ 就是将页面中的所有元素包在一起的部分，这部分还可以命名为: “wrapper“, “wrap“, “page“.2. Header“header” 是网站页面的头部区域，一般来讲，它包含网站的l
阅读全文
摘要：遇到的问题： 网站本身设计初衷就没有打算支持IE8及以下版本浏览器，并不是因为代码兼容性问题，而是真的不想迁就那些懒得更新自己操作系统和浏览器的用户，毕竟是我自己的网站，所以我说了算！哈哈~ 没有了低版本IE6浏览器，就不用顾虑他们的性能问题了，本以为开发会一帆风顺，结果”性能问题”竟然出现在了一直
阅读全文
摘要：本集合是有一位国外设计师收集整合，并由 oncoding翻译成中文的，感谢他们的辛苦贡献。CSS Sprites技术在国外并不是什么新技术，只不过近两年(尤其08年开始)中国开始流行这个词，大家也开始越来越关注CSS Sprites这个没有标准中文翻译的技术。CSS Sprites这个词如果直译的话
阅读全文
摘要：使用Photoshop为每个图片添加某种样式虽然可行，但会是相当乏味且困难的长久工作。下面要介绍的CSS技巧将帮助你从痛苦中解脱出来！ 阴影效果 通过使用带有一些padding之的背景图来添加阴影效果。 HTML <img class=”shadow” src=”sample.jpg” alt=””
阅读全文
摘要：使用XHTML+CSS来实现元素的垂直居中一直是前端开发中的一个比较复杂且棘手的问题，作为网页设计师或前端开发工程师，这个垂直居中问题也是必须掌握的技巧之一 该CSS垂直居中的条件: 1.已有一个已定义高度的容器(如<div>)2.内部有一个未知高度的对象(也许是后台动态生成的文本，放在另一个<di
阅读全文
摘要：为什么是960px？ 一直以来，网页设计师都希望寻找一个理想的页面宽度值，既能适应大部分屏幕，又尽可能的在一行显示更多的信息。 我们首先会考虑的是全屏自适应，但这并非一个好的解决方案。一方面，需要做一个能适应各个宽度的设计，从背景图片，到每个栏目标题的文字长度，都需要考虑到适应多变的宽度；另一方面，
阅读全文
摘要：前几天彬Go和大家一起讨论了960 Grid System这个CSS网格系统框架的基本原理和使用方法。今天，暴风彬彬将教大家使用Photoshop结合960 Grid System模板来设计一个真正符合960网格系统的网页效果图。 网格设计呢，通常显得很整齐规范，有时看上去也比较专业。但网格设计相对
阅读全文
摘要：Bryan Veloso 在最近在他重新发布的网站Avalonstar 上应用了960网格系统（960 Grid System）中的16列的PS模板开发。 在这同时感谢他给960.gs提供了网站的截图以供使用。 您还可以参考以下960网格系统相关教程:《960 Grid System 基本原理及使用
阅读全文
摘要：作为网页设计师(前端工程师)，你可能还记得曾经的那个网页大小建议:一个网页（包括HTML、CSS、Javacript、Flash和图片）尽量不要超过30KB的大小，随着互联网的日益庞大，网络带宽也在飞速发展，很多设计师已经不再考虑这条30KB的理想准则。随着越来越受欢迎的CSS布局和Javascri
阅读全文
摘要：本文里面收集一些有关CSS的技巧、教程、工具和观点等，其中一些你也许早就运用的炉火纯青，也可能有的你听都没听说过。不管是新手还是高手，大家都继续学习吧。 一，Web 标准 要玩游戏，就得先了解规则。要学CSS，就应该先了解一下Web标准。尽管看上去不是必须的(我在学CSS之前，根本不知道也不想知道W
阅读全文
摘要：您还可以参考以下网页设计相关资源:《美学设计—黄金分割与九宫格》《使用CSS创建三列固定布局结构》《精选15个国外CSS框架》《精选31个网站界面设计实践教程》《推荐20个关于网站可用性及界面设计的网站》 网页骨架 这些是web页面的主要元素。有很多不同的方法去组织它们，但是这种布局也许是最常用的。
阅读全文
摘要：工具&Web应用 13个可能会让你说”Thank You”的必不可少的开源应用 14个免费工具让你了解为什么人们会放弃访问你的网站 40+CSS生成器 74个我们可能已经忘记的适合网页设计师的很棒的Web应用 50+能提高你的网站速度和性能的技巧和资源 15个可以监视网站人气的工具 20个免费的SE
阅读全文
摘要：在中国，很多前端开发初学者都会把xHTML+CSS页面制作说成DIV+CSS，甚至很多人都还不知道xHTML+CSS是什么意思，只知道盲目的追求DIV+CSS，但在国外，是没有DIV+CSS这个概念的，很明显如果单从字面上去理解，DIV+CSS的网页就要全都是div，很明显是无法达到语义化标准的。彬
阅读全文
摘要：第一步:学会如何组合选择器 什么是选择器?如果你还不知道什么叫做”选择器”，你可以先参考一下w3schools.com的CSS语法概述。 未优化的CSS代码在下面的图例中，你会看到来自三个不同选择器的同样的CSS属性声明。 点击小图浏览清晰大图 优化的CSS代码你可以将上面的css代码优化组合，让所
阅读全文
摘要：CSS简写就是指将多行的CSS属性声明化成一行，又称为css代码优化。CSS简写的最大好处就是能够显著减少CSS文件的大小，其实还有很多其他益处。臃肿而杂乱的CSS样式表会使你遇到问题是难以调试。尤其是当一个团队在进行设计的时候，你的臃肿的CSS代码会使你的团队其他成员的工作效率下降。 属性值为0
阅读全文
摘要：CSS命名规范 一．文件命名规范 全局样式：global.css；框架布局：layout.css；字体样式：font.css；链接样式：link.css；打印样式：print.css； 二．常用类/ID命名规范 页 眉：header内 容：content容 器：container页 脚：footer
阅读全文
摘要：CSS代码的命名惯例一直是大家热门讨论的话题。今天暴风彬彬想通过分析一个流行三栏布局中的必要元素，来为大家讲解关于使用语义化方法替代结构化方法来命名CSS类的建议和指导。 您还可以参考彬Go的相关文章:《整理及优化CSS代码的7个原则》《10个CSS简写技巧让你永远受用》《DIV+CSS网页布局常用
阅读全文
摘要：我听说很多开发者厌恶 CSS。而在我的经验中，这往往是由于他们并没有花时间来学习 CSS。 CSS 算不上是最优美的『语言』，但迄今二十多年来，它都是美化 web 举足轻重的工具。从这点来说，也还算不错吧？ 尽管如此，CSS 写得越多，你越容易发现一个巨大的弊端。 因为维护 CSS 真是老大难。 特
阅读全文
摘要：Nick Babich – 早在2016年的时候，移动端流量就已经超越桌面端成为目前主流。根据Google UK 的研究，如今65%的英国成年人都以智能手机作为他们的主要上网设备。 人们通过移动端设备搜索信息，在线购物，使用移动端设备订阅各种服务。用户偏好上的转变推动着用户期望发生变化。现如今，绝大
阅读全文
摘要：在Tutorialzine上你可以了解最新最酷的Web发展趋势。这就是为什么每个月都会发布一些偶然发现并认为值得你关注的最佳资源的缘由。 Direction Reveal （方向展示） 该插件检测光标进入或离开块时的方向，允许你使用各种酷炫特效和过渡。它提供了一些开箱即用的CSS动画，让你可以轻松创
阅读全文
摘要：这是一个备忘清单，可以让你在不用做太多选择的情况下快速学习。我会列出一些工具来满足大部分场景下的前端开发。当你看完这篇文章，你会有足够的自信来调整你的技术栈。 ☉概要 我会将地图划分为你需要解决的问题。对于每个问题将包含： 问题描述以及所需工具 决定用哪种工具来解决问题 解释我为什么选择这个工具 给
阅读全文
摘要：一：Git是什么？ Git是目前世界上最先进的分布式版本控制系统。 二：SVN与Git的最主要的区别？ SVN是集中式版本控制系统，版本库是集中放在中央服务器的，而干活的时候，用的都是自己的电脑，所以首先要从中央服务器哪里得到最新的版本，然后干活，干完后，需要把自己做完的活推送到中央服务器。集中式版
阅读全文
摘要：很多人都在寻找那些能够帮助他们快速提升设计能力的方法，但你是否想过，自己身上的哪些方面会对你的设计产生影响呢？是使用工具的技巧，对设计的理解和态度，还是你的生活习惯呢？我想说所有这些都是决定你的设计是否优秀的因素，而在这之中，对设计本身的理解尤为重要。在这篇文章里，我尝试着通过那些经典的设计原则和设
阅读全文
摘要：所谓的浏览器兼容性问题，是指因为不同的浏览器对同一段代码有不同的解析，造成页面显示效果不统一的情况。在大多数情况下，我们的需求是，无论用户用什么浏览器来查看我们的网站或者登陆我们的系统，都应该是统一的显示效果。所以浏览器的兼容性问题是前端开发人员经常会碰到和必须要解决的问题。 在学习浏览器兼容性之前
阅读全文
摘要：pringboot和vue结合的方案网络上的主要有以下两种： 1. 【不推荐】在html中直接使用script标签引入vue和一些常用的组件，这种方式和以前传统的开发是一样的，只是可以很爽的使用vue的双向数据绑定，这种方式只适合于普通的全栈开发。 2.【推荐】使用vue官方的脚手架创建单独的前端工
阅读全文
摘要：性能测试是一项不可避免的任务，但问题是怎么保证测试的指标是正确且合理的？在这篇文章中，你将会了解到为什么常见的主要测试指标是不完美的，以及十个新的测量指标 —— 它们可能会改进你未来的性能测试报告。 在很多企业中，性能测试是定期进行的。作为这些测试的一部分，质量保证团队会收集各种指标并将其发布在性能
阅读全文
摘要：自从Linux上的容器变得流行以来，了解Linux容器和虚拟机之间的区别变得更加棘手。本文将向您提供详细信息，以了解Linux容器和虚拟机之间的差异。 Linux容器vs虚拟机 - 应用程序与操作系统 首先要了解的有关容器和虚拟机的一个事情是，一个运用于应用程序，另一个是为操作系统设计的。这就是为什
阅读全文
摘要：相对于桌面端浏览器，移动端Web浏览器上有一些较为明显的特点：设备屏幕较小、新特性兼容性较好、支持一些较新的HTML5和CSS3特性、需要与Native应用交互等。但移动端浏览器可用的CPU计算资源和网络资源极为有限，因此要做好移动端Web上的优化往往需要做更多的事情。首先，在移动端Web的前端页面
阅读全文
摘要：摘要: 前端性能优化是一个很宽泛的概念，本书前面的部分也多多少少提到一些前端优化方法，这也是我们一直在关注的一件重要事情。配合各种方式、手段、辅助系统，前端优化的最终目的都是提升用户体验，改善页面性能，我们常常竭尽全力进行前端页面优化，但却忽略了这样做的效果和意义。先不急于探究前端优化具体可以怎样去
阅读全文
摘要：为了获得更好的学习效果，我们建议你在本机安装 Nginx 并且尝试进行实践。 tcp_nodelay, tcp_nopush 和 sendfile tcp_nodelay 在 TCP 发展早期，工程师需要面对流量冲突和堵塞的问题，其中涌现了大批的解决方案，其中之一是由 John Nagle 提出的算
阅读全文
摘要：简介 我们会告诉你 Nginx 是如何工作的，其背后的概念有哪些，以及如何优化它以提升应用程序的性能。还会告诉你如何安装，如何启动、运行。 这个教程包括三节： 基础概念——你可以了解命令（directive）与环境（context）的区别、继承模式，以及 Nginx 选择服务器区块的顺序，还有安装位
阅读全文
摘要：摘要: Token 是在服务端产生的。如果前端使用用户名/密码向服务端请求认证，服务端认证成功，那么在服务端会返回 Token 给前端。前端可以在每次请求的时候带上 Token 证明自己的合法地位 不久前，我在在前后端分离实践中提到了基于 Token 的认证，现在我们稍稍深入一些。 通常情况下，我们
阅读全文
摘要：一、好接口的特性 (1) 易读 (2) 易用，难于误用 (3) 功能独立 (4) 容易扩展 二、好接口设计的基本原则 (1) 只做并做好一件事 函数名自解释 不恰当的函数名，往往是不恰当设计的征兆 函数名自解释 不恰当的函数名，往往是不恰当设计的征兆 (2) 如果没做到上一点，就将函数分解 只增加，
阅读全文
摘要：本次分享的大纲如下： 传统应用开发面临的挑战 服务化实践 服务化不是银弹 服务化架构的演进方向 一 、传统应用开发面临的挑战 挑战1– 研发成本高 主要体现在如下几个方面： 代码重复率高 在实际项目分工时，开发都是各自负责几个功能，即便开发之间存在功能重叠，往往也会选择自己实现，而不是类库共享，主要
阅读全文
摘要：一、背景 学过web开发的同学大多知道MVC设计模式，即通过Model-View-Controller分离和组合的方式，分解整个web后台的处理流程。起初项目包含的功能不多，开发人员可以直接在项目里实现MVC，快速迭代。但是当需要多团队并行开发多项功能时，问题就出现了： 某个小模块的功能缺陷可能导致
阅读全文
摘要：最近最火的词是什么？那大概就是微服务（Microservice）了。最近也火的一踏糊涂的Docker、AppOps也都是围绕着微服务领域的。在微服务领域还有很多相关名词。这些名词有一个共同的特点那就是晦涩难懂。他们就像中国古代的道、气、八卦等词一样，一解释就懂，一问就不知，一讨论就打架。 本文主要来
阅读全文
摘要：一、互联网高可用架构，为什么要服务化？ 【服务化之前高可用架构】 在服务化之前，互联网的高可用架构大致是这样一个架构： （ 1 ）用户端是浏览器 browser ， APP 客户端 （ 2 ）后端入口是高可用的 nginx 集群，用于做反向代理 （ 3 ）中间核心是高可用的 web-server 集
阅读全文
摘要：互联网架构演变 一体架构 在计算机软件发展早期，一般桌面软件都是采用这种架构，不管是界面还是业务处理还是数据处理都放到一个包中。这种其实谈不上架构，但也可以说是很好的架构，因为它足够简单。 mvc架构 但随着浏览器的出现便产生了web应用，web应用的特点是界面部分是显示在浏览器中，服务处理是在服务
阅读全文
摘要：本文收集的20款优秀的 HTML5 Web 应用程序，值得添加到您的 HTML5 的工具箱中，他们能够帮助你开发前端项目更快、更容易。 Initializr Initializr 是一个可以让你创建 HTML5 模板的网站，可以创建样板 HTML5 模板，响应式的 HTML5 模板或 Twitter
阅读全文
摘要：阅读本文需 8 分钟 阅读本文需 8 分钟 响应式设计起源：Ethan Marcotte在2010年写了一篇响应式的文章，宣扬这种新式的网页设计思想，经过3年的发展，响应式设计得到了众多设计师的认可。 本文的目的在于为大家集中推荐一些最有价值的响应式设计资源。包含了CSS框架、在线工具、准备阶段的工
阅读全文
摘要：JSON已经成为当前服务器与WEB应用之间数据传输的公认标准，不过正如许多我们所习以为常的事情一样，你会觉得这是理所当然的便不再深入思考 了。我们很少会去想用到的这些JSON库到底有什么不同，但事实上它们的确是不太一样的。因此，我们运行了一个基准测试来对常用的几个JSON库进行了测 试，看看在解析不
阅读全文
摘要：什么是JSON JSON：JavaScript Object Notation 【JavaScript 对象表示法】 JSON 是存储和交换文本信息的语法。类似 XML。 JSON采用完全独立于任何程序语言的文本格式，使JSON成为理想的数据交换语言S 为什么需要JSON 提到JSON，我们就应该和
阅读全文
摘要：摘要: 是否还在为你的应用程序适配PC端，移动端，平板而苦苦思索呢，是否在寻找如何一套代码适配多终端方式呢，是否希望快速上手实现你的跨终端应用程序呢，是的话，那就看过来吧，本文阐述响应式UI设计相关理论基础，包括：屏幕尺寸，物理，设备独立，CSS像素，dpr，视口等相关概念，还有响应式设计基础，常见
阅读全文
摘要：Dribbble 是众所周知的设计社群网站，在网站中有许多人分享设计作品，互相交流或从其他设计获取灵感。当然也有不少网站应运而生，例如 Freebbble 可免费下载 Dribbble 数千种设计素材，或是每次打开浏览器新分页可看到创意点子的 Niice、Muzli 外挂功能，除了把自己的作品上传到
阅读全文
摘要：注释标签 ruby: 行级元素 横排显示 试图写多个汉字和注释，需要多个ruby。 直接上代码： - css样式： 页面效果： 重点标记 mark: 以灰常黄的黄色来重点标记 页面代码： 类似于进度条的标签 meter： meter标签有以下的属性： min：类进度条的最小值 max：最大值 val
阅读全文
摘要：先来做一下准备工作 页面的效果： 看到上面的框框了吗？我们就是通过给这些框框添加背景色的方式，来让大家，了解css3的选择器的效果，下面正式开始： 关联选择器 E1~E2 选择 E1 后面的兄弟 E2。 页面效果： 选择除了第一个 p 元素之外，后面所有的 p 元素，即使中间隔着一个 div 标签，
阅读全文
摘要：1 字由 http://www.hellofont.cn/ 第一个工具，叫做字由。它是为设计师量身定做的一款字体工具。 里面的字体超多，像漫天星辰似的。万千字体只为适合你！ 如果你想找到与作品风格相近的字体，那么可以通过收藏、标签搜索等方式找到心仪的字体。 里面标签的分类也非常齐全，比如中国风，现代
阅读全文
摘要：一、背单词需要遵循的原则 1.信心原则 背单词之前一定要给自己信心，我肯定背的完，我今天就一定会记住，不管怎样，我都要记住。 如果你没有信心，就会导致自己背诵的时候目标松懈，感觉单词很难，自己还有明天。这就导致你天天都在背abandon。 2.时间分配原则 “要多次重复，忌一次详细”这十个字是真谛。
阅读全文
浙公网安备 33010602011771号