Lyz的博客


  • 首页

  • 关于

  • 标签

  • 分类

  • 归档

  • 日程表

  • 站点地图

  • 公益404

CSS之弹性盒子jusitify-content对齐方式

发表于 2017-10-30 | 分类于 CSS

justify-content用法

用于设置盒子元素在主轴(横轴)方向上的对齐方式

属性值

  • flex-start: 默认值,位于容器开头
  • flex-end: 项目位于容器结尾
  • center: 项目位于容器的中心
  • space-between: 项目位于各行之间留有空白的容器内
  • space-around: 项目位于各行之前、之间、之后留有空白的容器内
  • initial: 设置该属性为它的默认值
  • inherit: 从父元素继承该属性

align-content用法

在弹性容器内的各项没有占用交叉轴上所有可用的空间时对齐容器内的各项(垂直)

属性值

  • stretch: 默认值,项目被拉伸以适应容器
  • flex-start: 项目位于容器开头
  • flex-end: 项目位于容器结尾
  • center: 项目位于容器的中心
  • space-between: 项目位于各行之间留有空白的容器内
  • space-around: 项目位于各行之前、之间、之后留有空白的容器内
  • initial: 设置该属性为它的默认值
  • inherit: 从父元素继承该属性

CSS之z-index

发表于 2017-10-29 | 分类于 CSS

z-index属性

控制标签的层级关系,最底层的数值最小,最顶层的数值最大.通常当定义的CSS中有postion属性为absolute,relative或fixed时,用z-index会生效。数值越大时被层叠在最上边

1
<div style="z-index:10;">

例如:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<html>
<head>
<style>
.z1,.z2,.z3{
position: absolute;
width:200px;
height: 200px;
padding: 5px;
color: #5fcf3f;
text-align: right;
}
.z1{
z-index: 1;
background: #000;
}
.z2{
z-index: 2;
background: #c00;
}
.z3{
z-index: 3;
background: #999;
}
</style>
</head>
<body>
<div class="z1">z-indx:1</div>
<div class="z2">z-indx:2</div>
<div class="z3">z-indx:3</div>
</body>
</html>

z1,z2,z3是同等大小的div层,设置z-index属性不同,此时z3的z-index值比其它层大,页面显示z3层的内容
GitHub set up

设置next-Pisces主题透明度

发表于 2017-10-27 | 分类于 Study

调整Pisces主题内容版块的透明度

在\themes\next\source\css\_schemes\Pisces\_layout.styl目录下,修改.content-wrap中的内容,添加opacity属性:
GitHub set up

调整Pisces主题侧边栏的透明度

在\themes\next\source\css\_schemes\Pisces\_layout.styl目录下,修改.sidebar中的内容,添加opacity属性:
GitHub set up

阅读全文 »

Hexo的阅读全文设置

发表于 2017-10-26 | 分类于 Study

刚开始搭建博客时使用next主题,发现首页显示文章不管多长都会全部显示出来,就百度了怎样只显示部分内容,发现了两种方法。

-ONE

修改themes\next_config.yml文件,将enable值改为true,length是显示长度
GitHub set up

阅读全文 »

JQuery学习

发表于 2017-10-26

JQuery

JQuery 是一个 javaScript 函数库

jquery库导入


1
<script src="jquery-2.1.1.min.js"></script>

jquery库包含的功能


  • HTML 元素选取
  • HTML 元素操作
  • CSS 操作
  • HTML 事件函数
  • JavaScript特效和动画
  • HTML DOM 遍历和修改
  • AJAX–在不刷新页面的同时来修改页面的内容,将服务器所请求的数据直接显示在页面上
  • Utilties
阅读全文 »

Paradise

发表于 2017-10-25 | 分类于 Life

尚未佩妥剑,转眼已江湖。
愿历尽千帆,归来仍少年。
GitHub set up

不定期更新的日常(二)

发表于 2017-10-24 | 分类于 Life

关于学习


问题

  • 最近因为参与掌上天软的项目,有点偏离航道。在还没有什么基础的情况下,想要在这个项目中学习到什么,还是有些困难,应该要努力学习基础,一步一步来
  • 英语四级还是要争取下的

WEEX要用到的命令

发表于 2017-10-12

搭建开发环境


  • 安装 weex-toolkit

    1
    npm install -g weex-toolkit
  • 查看当前weex版本

    1
    weex -v

初始化


  • 初始化 Weex 项目
    1
    weex create awesome-project

执行完命令后,在 awesome-project 目录中就创建了一个使用 Weex 和 Vue 的模板项目。

阅读全文 »

hexo遇到的异常

发表于 2017-09-21 | 分类于 Experience

异常

今天写篇日常博客,运行$ hexo s -debug 命令,居然报错!

显示如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
INFO Start processing
FATAL Something's wrong. Maybe you can find the solution here: http://hexo.io/docs/troubleshooting.html
Template render error: (unknown path) [Line 67, Column 20]expected variable end
at Object.exports.prettifyError (D:\wodewangzhan\node_modules\nunjucks\src\lib.js:34:15)
at new_cls.render (D:\wodewangzhan\node_modules\nunjucks\src\environment.js:469:27)
at new_cls.renderString (D:\wodewangzhan\node_modules\nunjucks\src\environment.js:327:21)
at D:\wodewangzhan\node_modules\hexo\lib\extend\tag.js:66:9
at Promise._execute (D:\wodewangzhan\node_modules\bluebird\js\release\debuggability.js:300:9)
at Promise._resolveFromExecutor (D:\wodewangzhan\node_modules\bluebird\js\release\promise.js:483:18)
at new Promise (D:\wodewangzhan\node_modules\bluebird\js\release\promise.js:79:10)
at Tag.render (D:\wodewangzhan\node_modules\hexo\lib\extend\tag.js:64:10)
at Object.tagFilter [as onRenderEnd] (D:\wodewangzhan\node_modules\hexo\lib\hexo\post.js:266:16)
at D:\wodewangzhan\node_modules\hexo\lib\hexo\render.js:65:19
at tryCatcher (D:\wodewangzhan\node_modules\bluebird\js\release\util.js:16:23)
at Promise._settlePromiseFromHandler (D:\wodewangzhan\node_modules\bluebird\js\release\promise.js:512:31)
at Promise._settlePromise (D:\wodewangzhan\node_modules\bluebird\js\release\promise.js:569:18)
at Promise._settlePromise0 (D:\wodewangzhan\node_modules\bluebird\js\release\promise.js:614:10)
at Promise._settlePromises (D:\wodewangzhan\node_modules\bluebird\js\release \promise.js:693:18)
at Async._drainQueue (D:\wodewangzhan\node_modules\bluebird\js\release\async.js:133:16)
at Async._drainQueues (D:\wodewangzhan\node_modules\bluebird\js\release\async.js:143:10)
at Immediate.Async.drainQueues [as _onImmediate] (D:\wodewangzhan\node_modules\bluebird\js\release\async.js:17:14)
at runCallback (timers.js:781:20)
at tryOnImmediate (timers.js:743:5)
at processImmediate [as _immediateCallback] (timers.js:714:5)

Template render error 模板渲染错误

百度了很久,才发现可能是标记异常,赶紧回原文看了看
原来是文章中使用了大括号 { } 这个特殊字符,且没有转义导致编译不通过

  • 解决方案:将 { } 的大括号通过&#123; &#125; 进行转换

JAVA中的数组

发表于 2017-09-21 | 分类于 Java

数组


  • 数组是一组数据的集合,数组中的每个数据被称作元素。同一个数组中的元素类型必须一致
  • 定义:
    1
    2
    3
    4
    int[ ] x; //声明一个int[ ] 类型的变量
    x = new int [100]; //创建一个长度为100的数组
    int[ ] arr = new int[100]; //定义一个长度为100的数组

上述语句是在内存中定义了一个长度为100的数组变量,第一个元素的名称为x[0],第二个元素的名称为x[1],以此类推,第100个元素的名称为x[99],这些元素的初始值都是0。

阅读全文 »
1…3456
Lyz

Lyz

53 日志
10 分类
13 标签
戳一戳
  • 陈俊彦
  • 黄慧颖
  • 刘鹏
  • 王一川
  • 石志浩
  • 崔珊
  • 朱星星
© 2018 Lyz
由 Hexo 强力驱动
|
主题 — NexT.Pisces v5.1.2