有关层叠上下文和层叠顺序的理解

有关层叠上下文和层叠顺序的理解

在网页中的内容发生层叠的时候,一定有前后的层叠顺序产生(如下),所以我们这就需要我们理解css里的层叠上下文和层叠顺序。

一、层叠上下文

层叠上下文,英文称作”stacking context”. 是HTML中的一个三维的概念。如果一个元素含有层叠上下文,我们可以理解为这个元素在z轴上有较高等级。

那么z轴是什么呢?

在CSS2.1规范中,每个盒模型的位置是三维的,分别是平面画布上的X轴Y轴以及表示层叠的Z轴。一般情况下,元素在页面上沿X轴Y轴平铺,我们察觉不到它们在Z轴上的层叠关系。而一旦元素发生堆叠,这时就能发现某个元素可能覆盖了另一个元素或者被另一个元素覆盖。

如果一个元素含有层叠上下文,(也就是说它是层叠上下文元素),我们可以理解为这个元素在Z轴上就“高人一等”,最终表现就是它离屏幕观察者更近。

换句话说,页面中的元素有了层叠上下文,就等同于网页中元素级别更高,离我们用户更近了。
继续阅读有关层叠上下文和层叠顺序的理解

设计模式之工厂模式:简单工厂&工厂方法&抽象工厂

背景

设计模式有3大类,分为:创建型模式结构型模式行为型模式。工厂模式属于创建型模式,创建型模式提供了一种在创建对象的同时隐藏创建逻辑的方式,而不是使用 new运算符直接实例化对象。这使得程序在判断针对某个给定实例需要创建哪些对象时更加灵活。

简单工厂

描述:定义一个类用于创建父类相同的子类对象,由传入参数决定创建哪个子类。
简单工厂
举个例子,我喜欢玩游戏。定义一个Game接口,让具体的游戏去实现这个接口
继续阅读设计模式之工厂模式:简单工厂&工厂方法&抽象工厂

Vue生命周期

前言

文章是对整个Vue生命周期,以及在不同生命周期的过程中所发生的一些过程,以及一些简单的原理。涉及响应式,依赖收集,template编译,patch机制,diff算法。当然本篇文章只是简单梳理了一下过程,每一个部分并没有详细介绍,因为每一个部分的实现都是一个篇幅很长的东西。而且下面整理的很乱,估计只有我自己能看懂吧,后面有时间会重新整理一遍发上来。

继续阅读Vue生命周期

[SpringBoot] 使用 slf4j+logback 配合 aop 做日志记录

需要大致了解:java日志基础,如核心组件Loggers,Appenders,Layouts的用处、SpringAOP概念

为什么需要日志

当应用程序部署到服务器上运行时,用户在使用过程中可能会出现各种错误。这时应用程序将错误信息生成日志,就方便了开发人员快速定位错误和根源,从而进行有针对的维护。所以,在大型应用程序中,日志记录是必不可少的。
继续阅读[SpringBoot] 使用 slf4j+logback 配合 aop 做日志记录

正则表达式

正则表达式的作用

正则表达式(Regular Expression)是一种文本模式,包括普通字符(例如, a 到 z 之间的字母)和特殊字符(称为”元字符”)。

正则表达式使用单个字符串来描述、匹配一系列匹配某个句法规则的字符串。

正则表达式是繁琐的,但它是强大的,学会之后的应用会让你除了提高效率外,会给你带来绝对的成就感。只要认真阅读本教程,加上应用的时候进行一定的参考,掌握正则表达式不是问题。

许多程序设计语言都支持利用正则表达式进行字符串操作,在此我们以 python 的正则表达式模块为例。
继续阅读正则表达式

JS异步编程

前言

文中将简单整理一下js异步编程的方法。关于js异步编程,早期很容易出现回调地狱这一现象,也出现了一些相应的解决办法,从PromiseGenerator再到async/await,解决了回调地狱这一问题,当然本文只是浅显的举出一些实例,以及个人简单的理解。

异步编程这一块确实还有很多可以继续深入的地方。

继续阅读JS异步编程

初识Netty — 实现简单的C/S通信

写在前面:
Netty是Java的网络编程框架,既然是框架的学习,不免会碰到很多分支的知识和不熟悉的名词。这就需要不断的做“下潜”,耐心搜索,不求甚解,等到大致熟悉之后再去逐一深究。因此有些概念作者也不能做出详细解释,请参考贴出的相关文章或自行搜索以解决疑惑。

什么是Netty

网上很多文章都有作解释。以作者的使用体验来说,Netty是封装了 Java socket nio 来进行网络编程的工具。说到网络编程,大二软工的软件工程实训就有这个小课题,当时作者是用Java socket io来写,还没用到nio呢,就是参照网上的例子手动模拟通信过程,自己用最简单的 阻塞I/O 的模式写了一个Thread类来处理所有不同种类的请求,由于需求简单,尚能完成。 想要模拟效果更自然一点就要用 非阻塞I/O 模式,而nio就是用来写非阻塞I/O的api。但是nio的编写对java程序员是有比较高的要求的。Netty就可以简化这一系列操作。
继续阅读初识Netty — 实现简单的C/S通信

内联元素的一些探究

前言

本文依然是对《CSS世界》这本书中的一些知识点进行探究和实践。内联元素在CSS中极为重要,块级元素负责结构,内联元素负责内容,而CSS又是为图文展示而设计,因此显得尤为重要。同时多个属性混合在一起共同作用又会产生较为复杂的结果,比较典型的就是line-heightvertical-align,以及“幽灵空白”(CSS文档中叫strut)产生的一些现象了。

文中也将从这三个方面去入手,实践一些现象产生的原因。

继续阅读内联元素的一些探究