Solid | 易学教程

C#实践设计模式原则SOLID

阅读更多关于 C#实践设计模式原则SOLID

理论跟实践的关系，说远不远，说近不近。能不能把理论用到实践上，还真不好说。通常讲到设计模式，一个最通用的原则是SOLID： S - Single Responsibility Principle，单一责任原则 O - Open Closed Principle，开闭原则 L - Liskov Substitution Principle，里氏替换原则 I - Interface Segregation Principle，接口隔离原则 D - Dependency Inversion Principle，依赖倒置原则嗯，这就是五大原则。后来又加入了一个：Law of Demeter，迪米特法则。于是，就变成了六大原则。原则好理解。怎么用在实践中？一、单一责任原则单一责任原则，简单来说就是一个类或一个模块，只负责一种或一类职责。看代码： public interface IUser { void AddUser () ; void RemoveUser () ; void UpdateUser () ; void Logger () ; void Message () ; } 根据原则，我们会发现，对于 IUser 来说，前三个方法： AddUser 、 RemoveUser 、 UpdateUser 是有意义的，而后两个 Logger 和 Message 作为

Android-自定义进度条

阅读更多关于 Android-自定义进度条

圆形进度条，不确定进度条：　　 < ProgressBar android:layout_width ="wrap_content" android:layout_height ="wrap_content" />  < ProgressBar android:layout_width ="wrap_content" android:layout_height ="wrap_content" android:indeterminateDrawable ="@drawable/progress_bar1" android:layout_marginTop ="20dp" /> android:indeterminateDrawable="@drawable/progress_bar1" 的progress_bar1.xml： <? xml version="1.0" encoding="utf-8" ?> < rotate xmlns:android ="http://schemas.android.com/apk/res/android" android:pivotX ="50

less、sass、stylus

阅读更多关于 less、sass、stylus

less、sass、stylus 它们是三种类似的样式动态语言，属于css预处理语言，它们有类似css的语法，为css赋予了动态语言的特性、如变量、继承、运算、函数等。这么做是为了css的编写和维护。它们使用的文件分别是： .less、 .scss、*.styl,这些文件是不能再网页上直接使用的，最终要编译成css文件来使用，编译的方法有软件编译，或者用nodejs程序。 less、sass编译软件： http://koala-app.com/index-zh.html less中文网址： http://lesscss.cn/ less语法： 1、注释 // 不会被编译的注释 /* 会被编译的注释 */ 2、变量 @w:200px; .box{ width:@w; height:@w; background - color:red; } 3、混合 .border{ border:1px solid #ddd; } .box(@w:100px,@h:50px,@bw:1px){ width:@w; height:@h; border:@bw solid #ddd; } .box{ .border; background - color:red; } 4、匹配模式 .p(r){ postion:relative; } .p(a){ postion:absolute; } .p(f){

奇妙的 CSS几何图形

阅读更多关于奇妙的 CSS几何图形

三角形：通常会使用透明的border模拟出一个三角形：▲ .traingle { width : 0 ; height : 0 ; border-left : 50px solid transparent ; border-right : 50px solid transparent ; border-bottom : 100px solid yellowgreen ; } 切角：采用多重线性渐变实现切角 .notching { width : 40px ; height : 40px ; padding : 40px ; background : linear-gradient(135deg, transparent 15px, yellowgreen 0) top left, linear-gradient(-135deg, transparent 15px, yellowgreen 0) top right, linear-gradient(-45deg, transparent 15px, yellowgreen 0) bottom right, linear-gradient(45deg, transparent 15px, yellowgreen 0) bottom left ; background-size : 50% 50% ; background

H5表单基础知识（二）

阅读更多关于 H5表单基础知识（二）

表单新增属性    <form action="" > <fieldset> <legend>表单属性</legend> <label for=""> 用户名：<input type="text" placeholder="例如：李狗蛋" autofocus name="userName" autocomplete="on" required/> </label> <label for=""> 电话：<input type="tel" pattern="1\d{10}" /> </label>  <input type="file" name="file" multiple/> <input type="submit" /> </fieldset>

jQuery

阅读更多关于 jQuery

简介 jQuery 是一个 JavaScript 库。jQuery 是一个“写的更少，但做的更多”的轻量级 JavaScript 库。一、引入jQuery 1、<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"> </script>  2、<script src="jquery.js"></script>  3、<script src="https://code.jquery.com/jquery-1.12.4.js" integrity="sha256-Qw82+bXyGq6MydymqBxNPYTaUXXq7c8v3CwiYwLLNXU=" crossorigin="anonymous"> </script>  如果使用引用方法引入jquery，建议找到可靠的源二、选择器 1、通过id查找元素 HTML文件 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div id="i1">id=i1</div>

vue

阅读更多关于 vue

1. 遍历对象时,参数：第一个为值，第二个为键名，第三个为索引 1 <!DOCTYPE html> 2 <html lang="en"> 3 4 <head> 5 <meta charset="UTF-8"> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 7 <meta http-equiv="X-UA-Compatible" content="ie=edge"> 8 <title>Document</title> 9  10 <script src="https://cdn.bootcss.com/vue/2.5.17-beta.0/vue.min.js"></script> 11 <style> 12 #app div{ 13 padding: 2%; 14 margin-bottom: 1%; 15 border-bottom: 1px solid #ddd; 16 background-color: blanchedalmond; 17 } 18 </style> 19 </head> 20 21 <body> 22 23 24 <div id="app"> 25 26 27  28 <div

js实现模拟百度搜索

阅读更多关于 js实现模拟百度搜索

<! DOCTYPE html > < html lang ="en" > < head > < meta charset ="UTF-8" > < title > Title </ title > < style > body { padding-top : 100px ; text-align : center ; } #dv p { margin : 0 ; padding : 0 ; cursor : pointer ; padding : 5px 0 ; } </ style > </ head > < body > < input type ="text" id ="txt" > < button > 百度一下 </ button > < div id ="box" ></ div > < script src ="common.js" ></ script > < script > // 1.准备数据 var keyWords = [ " 吃火锅 " , " 吃鱼 " , " 吃卫龙 " , " 吃火腿 " , " 吃火鸡面 " , " 吃火龙果 " , " 喝烫水 " , " 喝水 " ]; // 2.给文本框注册键盘抬起事件 my$( ' txt ' ).onkeyup = function () { // 优化: 每次键盘抬起判断页面中有没有这个div if

JS 实现百度搜索功能

阅读更多关于 JS 实现百度搜索功能

今天我们来用JS实现百度搜索功能，下面上代码：　　　　HTML部分： <! DOCTYPE html > < html > < head > < meta charset ="UTF-8" >  < link rel ="shortcut icon" href ="https://www.baidu.com/favicon.ico" type ="image/x-icon" /> < title > 百度一下,你就知道 </ title > < link rel ="stylesheet" href ="css/baidu.css" /> < script src ="js/H.js" ></ script > </ head > < body onload ="onloads(),randomBack()" > < div class ="box" > < div class ="box_log" > < div class ="box_log_img" > < img src ="img/superlogo_c4d7df0a003d3db9b65e9ef0fe6da1ec.png" /> </ div > </ div > < div class ="box_text" > < div class ="box_text_content"

用Vue2.0实现简单的分页及跳转

阅读更多关于用Vue2.0实现简单的分页及跳转

用Vue2.0实现简单的分页及跳转 2018年07月26日 20:29:51 Freya_yyy 阅读数 3369 版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/Freya_yyy/article/details/81227016 用Vue2.0实现一个数据的分页及页数的跳转，代码如下：数据绑定：{{...}} <a v-on:click="btnClick(item)">{{item}}</a> 事件绑定：v-on <a v-on:click="cur--,pageClick()">上一页</a> 判断：v-if <li v-if="cur==1"><a class="banclick">上一页</a></li> 循环：v-for <li v-for="item in indexs" v-bind:class="{'active':cur==item}"></li> 修改样式：v-bind绑定class属性 <li v-for="item in indexs" v-bind:class="{'active':cur==item}"></li> HTML代码如下： <!DOCTYPE html> < html> < head> < meta http-equiv= "Content-Type" content= "text

订阅 Solid