FLEX | 易学教程

html：css3新特性：转换（二维，三维），过渡，动画，弹性布局

阅读更多关于 html：css3新特性：转换（二维，三维），过渡，动画，弹性布局

转换 2D 转换二维平面移动语法： transform:translateX( 移动的距离 ) translateY( 移动的距离 ); Transform:translate( 水平移动距离，垂直移动距离 ) 可以设置负值，水平的正值是向右移动，垂直的正值是向下移动二维平面旋转语法： Transform:rotate(30deg); 旋转原点的设置 transform-origin:center( 默认值 ) 可以设置 left,top,right,bottom,center, 百分比设置： transform-origin: 水平位置的百分比垂直位置的百分比 3D 转换透视点在所看元素的父元素或者是祖先元素上设置透视点语法 :perspective: 1000px; 三维立体的移动语法： transform: translateZ(200px); transform: translate3d( 水平移动 , 垂直移动 ,z 轴移动 ); z 轴： z 轴垂直于屏幕，方向是射向我们。三维立体的旋转语法： /*transform: rotateX(30deg);*/ /*transform: rotateY(30deg);*/ /*transform: rotateZ(30deg);*/ transform: rotate3d(1,1,1,30deg); 解析

Ubuntu安装flex和bison

阅读更多关于 Ubuntu安装flex和bison

在学习虎书，第二章练习要用lex和yacc，然而作者提供的网址上放的是flex和bison，当然这样更好啦（flex和bison完全兼容lex和yacc）。考虑到在windows下用这两个玩意还要安装masm，所以最后决定上虚拟机（之前操作系统课就装过了，幸亏没卸载哈哈哈）。 Ubuntu下使用 sudo apt-get install flex bison 命令，不一会就装好了，如图：然后写了一个测试程序，就用Ubuntu自带的gedit写，保存为.l文件： %% [\t] + is | am | are | was | were { printf ( "%s: is a verb\n" ,yytext);} [a-zA-Z] + { printf ( "%s: is not a verb" ,yytext);} .|\ n %% int main (){ yylex (); } 使用命令 lex verb.l 再使用命令 gcc lex.yy.l -lfl 最后运行 ./a.out 这个程序会判断输入的单词是不是动词：程序成功运行也说明我们安装配置成功了。来源： oschina 链接： https://my.oschina.net/u/4518215/blog/4751194

【编程鹿】害学element-ui 看这篇就够了

阅读更多关于【编程鹿】害学element-ui 看这篇就够了

环境搭建 npm 安装推荐使用 npm 的方式安装，它能更好地和 webpack 打包工具配合使用。 npm i element-ui -S CDN 目前可以通过 unpkg.com/element-ui 获取到最新版本的资源，在页面上引入 js 和 css 文件即可开始使用。  <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">  <script src="https://unpkg.com/element-ui/lib/index.js"></script> 我们建议使用 CDN 引入 Element 的用户在链接地址上锁定版本，以免将来 Element 升级时受到非兼容性更新的影响。 Hello world 通过 CDN 的方式我们可以很容易地使用 Element 写出一个 Hello world 页面。 <!DOCTYPE html> <html> <head> <meta charset="UTF-8">  <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk

Linux流量监控工具

阅读更多关于 Linux流量监控工具

一、iftop是什么？ iftop 是类似于top的实时流量监控工具。官方网站： http://www.ex-parrot.com/~pdw/iftop/ 二、iftop有什么用？ iftop 可以用来监控网卡的实时流量（可以指定网段）、反向解析IP、显示端口信息等，详细的将会在后面的使用参数中说明。三、安装iftop 安装方法1、编译安装如果采用编译安装可以到 iftop官网下载最新的源码包。安装前需要已经安装好基本的编译所需的环境，比如make、gcc、autoconf等。安装iftop还需要安装libpcap和libcurses。 CentOS上安装所需依赖包： yum install flex byacc libpcap ncurses ncurses-devel libpcap-devel Debian上安装所需依赖包： apt-get install flex byacc libpcap0.8 libncurses5 下载iftop wget http://www.ex-parrot.com/pdw/iftop/download/iftop-0.17.tar.gz tar zxvf iftop-0.17.tar.gz cd iftop-0.17 ./configure make && make install 安装方法2：(懒人办法，最简单)

Linux下流量监控:iftop的安装与使用

阅读更多关于 Linux下流量监控:iftop的安装与使用

1.简介 iftop does for network usage what top(1) does for CPU usage. It listens to network traffic on a named interface and displays a table of current bandwidth usage by pairs of hosts. Handy for answering the question "why is our ADSL link so slow?". iftop监听网络（和top监听cpu使用状态类似），通过监听指定的网口，来展示当前的带宽使用率，用于解答"您的adsl网络链接为何如此之慢”的问题项目地址： http://www.ex-parrot.com/pdw/iftop/ 用途对定位机器上的流量异常问题，和服务间调用问题比较有用。 2.安装有两种安装方式 1. yum/apt安装 2.源码编译安装 2.1 yum/apt #Ubuntusudo apt install -y iftop/xenial #Centossudo yum install -y iftop.x86_64 2.2 源码编译安装 2.2.1 预装系统包 #Ubuntusudo apt-get install flex byacc libpcap0.8

python图像处理-滤镜的算法原理实现

阅读更多关于 python图像处理-滤镜的算法原理实现

前言本系列课程是针对无基础的，争取用简单明了的语言来讲解，学习前需要具备基本的电脑操作能力，准备一个已安装python环境的电脑。如果觉得好可以分享转发，有问题的地方也欢迎指出，在此先行谢过。前言上一篇文章我们利用PIL自带的路径方法实现了一些滤镜的效果，单纯从使用的角度来说已经够我们使用了，但是如果能够弄清楚它们背后的原理，相信应该是会对我们更有帮助的。在正式讲解之前，有一些基本的概念还是要在重新了解一下。图片是由一个个像素组成的，每个像素又是由RGB三种颜色数值组成的(这里指的是RGB模式图片)，灰度图是由0-255单个数值组成的。所有的图片处理，本质上都是对像素值进行处理。灰度滤镜实现灰度图我们知道是由单一数值0-255组成的，一张RGB三种颜色组成的图片要变成灰度图，需要将它们的三种颜色值设为相同即可。由于人眼对绿色的敏感度最高，红色次之，对蓝色的敏感度最低，因此，当权值 G > R > B时，所产生的灰度图像更符合人眼的视觉感受。所以将颜色的RGB设置为相同的值即可使得图片为灰色，一般处理方法有： 1、取三种颜色的平均值 2、取三种颜色的最大值（最小值） 3、加权平均值：L = 0.299R + 0.587G + 0.114*B 黑白滤镜实现黑白效果实现和滤镜有点类似，只不过这里需要自己设定一个阈值，将每一个像素点的平均值与阈值100(这个不是固定的

颠覆了我对Spring的认知-阿里P9架构师推荐的Spring领域巅峰之作

阅读更多关于颠覆了我对Spring的认知-阿里P9架构师推荐的Spring领域巅峰之作

写在前面你第一次接触spring框架是在什么时候？相信很多人和我一样，第一次了解spring都不是做项目的时候用到，而是在网上看到或者是听到过一个叫做spring的框架，这个框架号称完爆之前的structs和structs2，吸引了不少人的注意。今天给大家分享一份阿里P9架构师推荐的Spring领域巅峰之作《Spring技术内幕：深入解析Spring架构与设计原理（第2版）》，我读完这本书之后彻底颠覆了我对Spring的认知。本书从源代码的角度对Spring的内核和各个主要功能模块的架构、设计和实现原理进行了深入剖析。你不仅能从本书中参透Spring框架的出色架构和设计思想，还能从Spring优雅的实现源码中一窥Java语言的精髓。适读人群：无论你是Java程序员、Spring开发者，还是平台开发人员、系统架构师，抑或是对开源软件源代码着迷的代码狂人，都能从本书中受益。转发+关注，即可获得《Spring技术内幕：深入解析Spring架构与设计原理（第2版）》电子版的免费领取方式内容结构本书主要内容分为三个部分，分别阐述了Spring的核心、组件和应用三个方面。在展开这三个部分的内容之前，第1章对Spring的项目情况和整体架构进行了简要的介绍，这一章就像一个热身活动，为本书的主要内容做铺垫，如果您已经很熟悉Spring的使用，这一章可以自行跳过

从零开始学习前端开发 — 18、BFC

阅读更多关于从零开始学习前端开发 — 18、BFC

一、 BFC的概念 BFC——block formating context的缩写，中文译为"块级格式化上下文" 二、如何触发BFC 1.设置float除none以外的值(left,right) 2.设置overflow除visible以外的值(hidden,auto,scroll) 3.设置display属性(table,table-cell,inline-block,flex) 4.设置position属性(fixed,absolute) 三、BFC的作用 1.可以解决上下margin重叠问题可以给其中一个元素在外层嵌套一个父容器，并设置overflow:hidden;这样为里面的元素创建了一个块级格式化上下文 2.可以解决高度塌陷问题父元素高度自适应，子元素浮动脱离文档流，不占据父元素空间，导致父元素高度为0，此时给父元素设置overflow:hidden,闭合浮动，触发了BFC 3.可以实现多栏布局两个浮动元素相邻，另外一个元素设置overflow:hidden;触发了BFC 来源： oschina 链接： https://my.oschina.net/u/4335122/blog/4202835

四面腾讯与华为，大厂前端面试真BT！

阅读更多关于四面腾讯与华为，大厂前端面试真BT！

今年算是经历颇多的一年了，腾讯和华为都走了几趟（一共面试了四个部门），拿了两个offer。（开心.png），但还是挂了两次，有点遗憾。面试题总结面试完之后，赶紧总结了一波，前端这个岗位，这两家大厂的面试思路和面试问题其实都差不多： 1. JS底层：说一说js的原型与继承。分析一下优秀的前端框架源码，这么写的优缺点在哪。 this指向问题，this的深拷贝如何实现，这个也是高频率被问到的问题。 js事件流是怎么样体现的。柯里化函数。 2. 数据层：写过中间件么？了解koa么？数据安全是怎么处理的。 axios 与 fetch的实现。 3. HTTP相关：跨域问题的产生与解决。 http1.1时如何复用tcp连接。 http2.0新的变化。 http报文的请求分成几个部分？前端与后台交互的时候会产生几次握手，分别做了什么？ 4. 框架：说一说vue的源码的响应式与数据驱动，主要是问原理。 Vue与react的区别在哪，这个也是问底层实现。虚拟dom、diff算法等等，基本没问到过怎么去使用。像组件传值啥的没提过。还有就是路由的管理有没有封装过组件库， dev-server是怎么跑起来的。 5. 服务端与工具主要是Node的问题，有没有拿node做过中间层。 Node的线程处理、事件循环。这个主要就是 webpack 与 babel 的配置

「小程序JAVA实战」小程序的flex布局（22）

阅读更多关于「小程序JAVA实战」小程序的flex布局（22）

转自：https://idig8.com/2018/08/09/xiaochengxu-chuji-22/ 之前已经把小程序的框架说完了，接下来说说小程序的组件，在说组件之前，先说说布局吧。源码：https://github.com/limingios/wxProgram.git 中的No.9 小程序的flex布局小程序建议使用flex布局进行排版 >其实div+css的方式也可以，只是官方建议使用flex布局的方式 flex 就是一个盒装弹性布局 flex是一个容器，所有的子元素都是它的成员。整个是一个大盒子，大盒子里面有很多的小块a，b，c，d，e，f都是他的成员，针对其中的成员可以增加对应的样式，可以看出来a，b，d是比较大的，c是最小的，我们可以通过样式控制它们的大小，我们也可以通过order的方式控制他们的位置顺序，一般正常的咱们的页面都有顺序的，可以通过布局的order属性，把顺序给展示出来。定义布局display:flex flex 容器的属性 flex-direction：排列方向 flex-wrap：换行规则 justify-content：对齐方式 flex-direction 容器内的方向，方向可以从上到下，从左到右。 row[flex-direction 默认布局方式] 从左到右 row-reverse 从右到左 column 从上到下 column

订阅 FLEX