推荐
最新
Bootloader
Grand Unified Bootloader,now known as ‘grub legacy’
https://www.gnu.org/software/grub/manual/legacy/grub.html
https://www.hirensbootcd.org/
- 它是一种Bootloader,类似于Windows安装时写入MBR的引导器(负责加载
NTLDR:可称为加载器); 它负责加载活动主分区中的grldr,grldr会读取menu.lst/grub.conf,显示系统选择菜单. - GRUB’s two stages
stage1: 汇编代码部分,位于
MBR中,负责基本的硬件设备的初始化 + 加载Stage2到内存 stage2: C程序代码,本阶段的代码知道如何找到grub.conf文件,并读取它! - functions
初始化本阶段要用到的硬件设备 + 检测系统内存映射 +
读取配置文件:menu.lst(RHEL中是grub.conf,~windows的boot.ini),显示启动菜单 +
解压kernel镜像 :
vmlinuz-解压到0x100000 + 解压VRFS映像 :initrd(提供虚拟跟文件系统),据此kernel找到/lib/modules/中各驱动并挂载根目录!
grub2
VB
http://blog.csdn.net/rainylin/article/details/2173029
http://www.cnblogs.com/BeyondTechnology/archive/2011/01/10/1932440.html
Basic
windows 脚本解释程序:
wscript.exe(Windows Scripting Host)
wscript.exe 可以执行.vbs, .wsh, .js等程序
Js Packages
axios
response { // 返回对象
data: {},
status: 200,
statusText: "OK",
headers: {}, // 响应头
config: {url: "xx", method: "get", headers: {},} // 请求的配置
}
// 全局默认值
axios.defaults.baseURL = '';
axios.defaults.headers.common['Authorization'] = '';
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
axios.interceptors.request.use((config) { // request interceptor
return config
}, (error){})
axios.interceptors.response.use((response){ // 2xx返回的都会进来
if (response.config.responseType === 'blob') {
return response
}
if (response.data.ret !== 0) {
}
}, (error){ // 非2xx返回的都会进来
})
// 实例默认值
axios.create({
baseURL: '',
timeout: 1000,
headers: {'X-Gd-Req': ''},
params: {ID: 1}, // url params; get常用!
responseType: "json", // 默认值. blob arraybuffer document text stream
maxContentLength: 22,
onDownloadProgress: function(evt){
},
onUploadProgress: function(evt){
},
})
// 也可用then方式,但不直观! 也可以结构+重命名: const {data:res}
const res = await axios.request(config)
axios.post('/user/12345', {
data: { // 仅适用于 PUT/POST/PATCH
firstName: 'Fred',
lastName: 'Flintstone'
}
}).then(function(response) {
response.data.pipe(fs.createWriteStream('ada_lovelace.jpg'))
}).catch();
axios.all(iterable)
axios.spread(callback)
pubsub-js
npm install pubsub-js
CSS
selector
selector {property: value; property: value;}
- 注释仅支持/**/,以下仅为了方便
- 块级标签:
div, h1/hr, ul/ol/dl, p/pre, form, table, blockquote/marquee;块级元素才有width/height概念(若不指定宽高,则为父亲100%)! - 优先级(多个选择器给元素设置属性): id选择器 > 类选择器(属性选择器,伪类选择器) > 标签选择器(伪元素选择器)
- 层叠性: 分别统计每个
selector的上面三元组的个数,然后排序,排序高的使用;相同的,使用代码上后面一个
c1.c2 {} /* 同时含有c1与c2类！*/
/* h1 || h2的所有后代p || h3里面的所有1级p元素 || h4的第1个兄弟 || 含有id1属性及class=a属性的div */
h1, h2 p, h3>p, h4+p, div[class="a"][id1] {
color: red !important; /* important:打破优先级,若有其他设置与本条冲突,则优先使用;不会被继承! */
font-family:"consolas, sans serif";
}
#idname {} /* <p id="idname">..</p>; 与html一起工作时,大小写敏感! */
[attr] {} /* 带有attr属性的所有元素 */
[attr=value] {} /* 属性值='value' */
[attr~=value]{} /* 由空格分隔的多个属性至少匹配一个.类似于'*=' */
[attr|=value]{} /* 属性值以'value-'开头 */
[attr^=value]{} /* 属性值以'value'开头 */
[attr$="val"]{} /* 属性值以'val'结尾 */
[attr*=value]{} /* 属性值以包含'value'子串 */
/* functions */
:not(p) /* 不是p标签 */
a :link /* 链接访问之前; visited; hover; active(点击但不松手时) */
input :focus /* 获得焦点的input元素 */
div :only-child /* 仅有一个子元素的所有 */
div :empty /* tag里面不包含任何内容 */
div :target /* toc切换加外边框 */
div :enabled /* disabled/checked */
div ::selection
div li :nth-last-of-type /* 最后一个li元素 */
div#id1 :nth-child(2n) /* 所有偶数行,2n-1:奇数行; -n+5:前5个; 3n:3的倍数; 注意:名称有些误解,表示的是同级元素! */
div:nth-of-type(2) /* 第2个类型为div的元素 */
xx :nth-last-child(n) /* 倒数第几个. 单独写n表示每一个 */
xx :first-child/of-type
xx :last-child/of-type
p ::first-line/letter
.box :before {
content: "box多出来的内容,可以选择"
}
/* :visited(点击链接后)/:active(点击连接时)/:focus(通过键盘选择或已经被点击过都会获取焦点) */
.box :hover:after{
color: red; /* 要添加内容使用content:"这里面是伪元素,界面上选中不了的" */
}
demos
<head>
<!-- 会并行下载该文件,不会停止对DOM的解析 -->
<link rel="stylesheet" href="font-awesome-4.7.0/css/font-awesome.min.css" />
</head>
{
// top right bottom(>0表元素或块的下边沿相对于position抬高多少) left
// 下面这个写法表示水平居中(auto表水平自动),注意此时该盒子必须具有width(否则独占整行); float的盒子该设置无法居中!
// 注意: 嵌套的div/p,若外层div无border,则内层的margin-top/bottom会转移给外层div使用,表现怪异! 故:--->
// margin本质上是描述兄弟之间的距离!父子之间的距离应该使用padding来描述!!!
margin: 0 auto; // 使块居中(上下+左右); top right bottom left,缺少一个则最后一个对称相补; 若仅提供一个值则其他值全部由top补齐.
// 解决办法: 父元素添加'overflow: hidden' 或 'position: absolute;' 或 给父元素添加有效的border/padding属性 或 子元素添加'float: left'
padding: 1em 2px;
min-width: 20px;
width: calc(100% - 2*2px); //
// 如果是一段文本,则表示这段文字里最长的单词; max-content:一直不换行!
// flex中,若元素总宽度超过了box宽度,则每个元素的宽度就是min-content
width: min-content;
// flex: css3标准,IE10仅部分支持! https://www.bilibili.com/video/BV1A44y1Z7Bp
// flex盒子是具有默认宽度的(当前viewport宽度),如果元素(默认每个都是min-content)总宽度超过了它,则元素不会换行,会冲破边界!
// flex盒子元素也可以强制指定width多宽!
// grow shrink basis; 默认值('0 1 auto' == initial, auto == 1 == '1 1 auto', none == '0 0 auto')
// grow: 如果box宽度大鱼items总和,则每一个item增加宽度x,满足: n*(flex-basis + flex-grow*x) = box-width; 一般配合nth-child()来单独控制该item是其宽度的几倍!
// basis: 默认auto(item的min-content宽度),可设置固定的item宽度
flex: 1; // == 1 1 auto
// 默认值; column:从上到下垂直排列; row-reverse:从右至左排列子元素
flex-direction: row;
// 将内联标签变为块级标签; inline:变为内联标签(不接受padding的设置,==span) inline-block:内敛但可设置margin,width这些属性 none:delete元素布局也没有了
display: block/flex;
// https://www.runoob.com/cssref/css3-pr-justify-content.html
// 主轴对齐方式; space-bewteen, space-evenly
justify-content: space-around;
// 纵轴对齐方式
// stretch:统一成最大哪个元素的高度,默认值
// flex-start: 交叉轴的起点对齐; flex-end; flex-center
// baseline: 每个item中第一行文字的基线对齐
align-items: baseline;
// https://www.freecodecamp.org/news/css-positioning-position-absolute-and-relative
// 相对/绝对/固定定位都可以使用z-index值!
// sticky: 只能在最近的具有'overflow:scroll'的父容器中使用:滚动条下滑动时,它也下滑.但滑到上方无空间时,就被顶(sticky)在了viewport.此时它不会挤占下方元素的空间,会漂浮在最顶层.
// fixed: 相对于浏览器窗口,亦不受滚动条影响(背景图用的比较多)!
// 参考点要参考已经定位的最近的祖先元素,无时html!
// 完全脱离了正常的文档流.它的坐标系参考html. 如果还是想已parent作为参考系呢? --> 把parent-position设为relative:(relative-absolute)!
// 注意: 与(static-relative:常用组合)的区别: 诞生点是否脱标:是否可以被别人占用!
// 注意: 绝对定位的儿子,无视参考的那个祖先盒子的padding,即还是以祖先的border作为参考点!
// absolute: 会跟随滚动条滚动. 它的位置会被正常的文档流挤走.
// static: 默认值!此时,left/right/top/bottom/clip无效(无坐标系)! 如果此时想微调下某个元素的位置,使用relative! relative是相对于父元素static而言的移动!
// relative: 长用来微调. 以其本身位置,其真实位置还在老家,只不过是影子过去了(定位未脱标:别人不会把它的位置挤走)!
position: relative;
right: 0; // 注意: 非0值必须加单位!
bottom: 0; // bottom定位时,参考点在首屏左下角.top(页面的左上角)
// ----------------- border
// 整个网页的最大盒子是<document>,<body>是<document>的儿子.<body>默认的margin大小是8px.
border: 1px solid red; height:80% // 如果上方有些'border-left'此处会覆盖掉它(一般都是写在大属性下方来覆盖)
border-radius: 8px 20px; // 左上角->右上->顺时针; 8px/6p:水平半径,垂直半径!
border-shadow: 0 1px 0 .., inset 0 1px 0 rgba(0,0,0,.3);
border-style: dotted; // none(default), dashed, solid, double, groove(浅槽), ridge(脊线), inset(凹陷), outset(凸起)
border-width: thin; // medium(default), thick, length
border-color: red;
border-top-width: 2px; // border-top-style, border-top-color, border-top; border-bottom..border-left..border-right
border-collapse: collapse; // 否则每一个table,th,td都有一个边框就有两个边框了
box-sizing: border-box; // padding+border的值不会影响元素的高度,相当于把他们都算在content. 默认是content-box;
// ----------------- text
// 文字的样式属性都具有继承性
color: gray; // CSS规范定义了17个颜色名
mix-blend-mode: difference; // 若背景时图片的话可能比较合适
text-align: justify; // 文本对齐方式, 两端对齐, left, right, center;也可居中img!
line-height: 1.2em; // normal(default), 一般用来居中(设置为height数值); 可作用于p. 行高/字号一般是偶数(保证能被2整除)
text-decoration: underline; // none(缺省值,也可用来去掉链接的下划线), overline, line-through
text-indent: 2em; // 具有继承属性
letter-spacing: normal;
word-spacing: 1cm;
text-transform: uppercase; // 所有文字转换为大写; lowercase,capitalize,none
text-shadow: 2px -2px 2px #ccc; // x-offset y-offset blur color
vertical-align: middle; // 行级元素(inline,inline-block,td)的垂直对齐方式
vertical-align: baseline;
// visiable(默认值,显示多余的内容,不剪切); auto(溢出时有滚动条); scroll:win始终显示滚动条,mac同auto;
// 如果div包裹了一个img,css限定div的width/height,则超出的部分默认会显示出来,好像被撑开了,此时可配合该属性!
overflow: hidden;
box-shadow: 2px 2px 2px 2px #666; // x-offset y-offset blur [spread] color
background: color url(image) pos-x pos-y repeat contain, blue ...
background-color: #99ff00; // default:transparent, blue, rgba(25%,35%,45%,.5)
background-image: url(../image/demo.jpg); // 必须使用url(),不能使用双引号!
background-image: linear-gradient(to right,red,blue) // CSS3; 默认不加方向是中心到四周; 0deg:↑ 90deg:→ 'at top':中心点在最上方中心
background-size: cover // 使img填满(保证长宽比,等比例放大,裁切),contain:全部显示,等比例缩小,其他地方留白; 8px 6px; 50%; 100% auto;
background-repeat: repeat-x; // repeat-y, no-repeat; 不指定时即默认(平铺满): repeat-x + repeat+y
background-position: 50% 50%; // center top; 以图片左上角为操作点!
background-attachment: fixed; // scroll(default:与滚动条一起滚动)
transition: bottom 2s linear 0s; // bottom位置变化的动画(或transform表变换下面的操作),线性2s,延迟0s; 后俩默认可省略!
transform: scale(x,y); // 仅写一个表等比列缩放; 并不会把兄弟元素挤走!
transform: rotate(45deg); // 顺时针
transform: translate(-50%,-50%); // 水平平移,垂直平移; 也有相应的3D版本!
transform-origin: center center; // 操作的中心点:left(0) center(50%:default) right(100%); top(0) center bottom
transform: rotateX(45deg); // 3d旋转,对着x轴箭头方向看,顺时针旋转; 注意:z轴箭头是朝向屏幕外的!
list-style-type: upper-roman; // none,disc,circle,square,decimal,decimal-leading-zero,lower-roman,upper-roman,lower-alpha,upper-alpha,lower-greek,upper-greek,hebrew...
list-style-image: url(img/2.gif); // 注意:url括号里面不加引号!
clip: rect(0,2em,6em,0); // 右下个裁剪2em,6em
visibility: visible; // hidden(仍然会影响元素的布局), collapse, inherit
z-index: 8; // 值越高离读者越近, auto(default)
content: ""; // 由css生成的html内容
cursor: pointer; // default,hand,move,help,text,wait,w-resize...
}
fonts
https://www.iconfont.cn/
http://www.zhaozi.cn/
https://github.com/zenozeng/fonts.css
https://github.com/wordshub/free-font
http://zenozeng.github.io/Free-Chinese-Fonts/
Sublime Text
Preferences.sublime-settings
{
"font_face": "Consolas",
"font_size": 11,
"ignored_packages":
[
"Vintage"
],
"theme": "Soda Dark.sublime-theme",
"update_check":false, // 不自动检测更新
"word_wrap"`: false // 不自动换行
}
packages
ctags: parse源代码,方便跳转.注意要下载ctag置于path
SOA
| terminology | description | memo |
|---|---|---|
SaaS | Software as a Service | 给客户提供网络服务程序:使客户可以通过瘦客户端直接显示界面,比如在线的’Google Docs’. 面向普通大众. |
PaaS | Platform | 给客户的程序提供运行环境,包括:网络、服务器硬件、操作系统、存储等.客户可以自由控制自己的程序和托管环境. 面向软件开发者. |
IaaS | Infrastructure | OpenStack、AmazonEC2 |
ESB | Enterprise Service Bus | |
SOA | Service Oriented Architecture |
Distributed
- 分布式是为了去中心化, 降低服务程序之间的耦合. – 合久必分
- 它是一个按业务拆分成独立的进程, 分布在不同的地方, 每个构成一个节点, 节点间通过网络沟通. 其中每个node都可以单独做集群.
- 为了规范统一及扩展性,一般服务器之间的通讯使用RESTful标准. 服务器一般是无状态的(可使用Redis共享). 对外服务的service一般叫Gateway!
Cluster
其对外表现通常为一个服务器. – 分久必合
Project Management
每个人可能都有这样的经历:
flowchart LR
A(["买运动鞋"]) -- "用一般的价格" --> B("只要穿上就不舒服") --> C("穿一年就坏")
C --> D{"新的一年?"} -- Yes --> A
这与剃须刀原理一样: 好用的东西往往初期成本高, 但总体成本低且带来了长期优势…
W3m
https://github.com/ivmai/libatomic_ops/
https://github.com/ivmai/bdwgc/
很遗憾,该浏览器不能正确解析button,导致有些button事件不能触发!