发表于: 2017-03-10 00:54:28

2 741


【今天完成的事情】

1、任务相关的事:

(1)把页面用栅格快速捋了一遍。

(2)找到一个用unslider插件做出来的网站(http://myvin.xyz/unslider.zh-CN/),很干净和漂亮,然后这个unslider的轮播插件又研究了一会,没研究出来.....等我学了JS或者把页面都写完了再继续研究里面的东西。

(3)一开始把整个页面随便布局了一遍之后,把“高效规范人脉”和“优秀学员展示”这两块的样式进行了调整

2、其他的事:

(1)玩了一下批处理文件。

(2)看了一篇文章接受思想教育《為什麼成為一名工程師這麼難 —— 從程式新手到準工程師的必經之路》(https://www.inside.com.tw/2015/03/27/why-learning-to-code-is-so-damn-hard)

修真院的模式大概是挑战了这篇文章所描述的传统意义上的历程吧,直接做任务开始,跳过文章中说的第一个阶段:手牵手心连心的蜜月期。直接给任务,做任务,然后自己想办法去找资料自己去学去努力。嗯!继续努力!


【明天计划的事情】

1、再花1个小时找bat批处理文件无法识别中文字符的解决方法。

2、再花2个小时解决一下昨天hexo遇到的问题。(我真的很想像昨天那个“你敢点吗”按钮那样,实现,在点击播放bgm的时候,博客里会有一些部件在动,很好玩!)

3、继续做任务8,写页面。


【遇到的问题】

1、关于批处理文件。

那个日报我是用sublime来写的,因为没有后缀名,我觉得挺好的。然后我就ctrl+c一个日报模板文件,在一个文件夹里ctrl+v了一大堆副本。然后我想把这一坨副本的文件名改成按照时间顺序命名。“yyyymmdd日报”这样。然后就找到了一个方法:

在要改文件名的文件夹下shift+鼠标右键,点击“在此处打开命令窗口”,在cmd窗口里输入dir /b>rename.xls。这个文件夹就多了个rename的xls表格,A列就会出现一列的你的文件夹里所有的文件名称。

然后删掉那些不用改文件名的行。然后在B列设置与A列对应的要改的文件名,一行一个文件名。然后在C列输入这个等式="ren "&A1&" "&B1。然后往下拖,拖到和AB两列一样这么多行。

然后复制C列到文本文档里,把文本文档后缀名改成.bat。然后点击就能改好了。


按道理说应该能改好。但是我并没有改好,原因是,因为创建的是副本,所以文件名里有空格,然后我就去找删掉空格的方法。

@echo off&setlocal enabledelayedexpansion
for /f "delims=" %%i in ('dir /s/b *.*') do(
set "foo=%%~nxi"
set foo=!foo: =!
set foo=!foo: =!
ren "%%~fi" "!foo!"
)
exit

找到了这段.bat文件的代码。然而似乎只能删掉这堆文件名里一个空格,不能删掉所有的空格,而且这段代码还看不懂,就有点忧桑。百度知道上有人说改成全角空格,也没有解决。


然后又找了一个批处理的方法。(http://lzhnightwind.iteye.com/blog/2067230)

把文件名中的'.'替换成'_'
并且去掉含有的空格
@echo off
setlocal enabledelayedexpansion
for %%j in (*.*) do (
set filename=%%~nj
set filename=!filename:.=_!
set filename=!filename: =!
if not "!filename!"=="%%~nj" ren "%%j" "!filename!%%~xj"
)

这个方法靠谱!虽然原理不懂。但是确实能删掉空格,而且看他的意思还能删掉别的特殊符号,好用!

然后我就去用第一个方法批量改名了。。但是还是不行。按照它的过程改下来,还是不行啊。什么原因呢?直接点击bat文件一闪而过就没了。然后我试试在刚刚shift+右键点击“在此处打开命令窗口”打开的cmd窗口试试输入rename.bat(这个是按照第一个方法做出来的bat文件)。然后就看到一对乱码。哦,看来似乎是不能识别中文字符啊。。(问题没解决,因为发现这个问题耗了比较多的时间)

中途也想过要不在sublime里创建一个模板吧,但是又不是很想整这个。就算了。后来找到了一个批处理的论坛,先保存下来。http://www.bathome.net/index.php


2、在写“优秀学员展示”这一块的过程中。

我很自然就想到1个row里12个col,这一行有4个学员展示,那每一个学员展示就占3个col,然后我就这么设置了,但是,每个col之间间距bootstrap用的是padding(下图中绿色的部分,chromeF12调试的时候就是这么显示的)。然而padding是内边距,如果给这个框框设置边框和阴影的话,每个学员展示框之间就没间距了。

那怎么办,首先我第一时间想到的当然就是给展示框增加margin值,但是不可行,因为占得满满的12个col,如果加了margin值,最后一个展示框就会换下一行。

然后我就想到往里面嵌套row和col,给嵌套的子标签设置padding和边框以及阴影,父元素这四个展示框之间的padding值就变成了四个展示框框的间距,理论上应该可行。但是这个时候遇到padding和padding,margin和margin之间会合并到一起的问题。然后我就想到padding和margin之间不会合并,所以我设置了嵌套的子标签的margin为1px,那子元素和父元素的padding就不会合并了。就解决了。


3、依然是“优秀学员展示”这一块。

里面“技术顾问:罗大佑”,我给他设置了margin:3rem 0;之后发现他被迫换行了,然后F12找原因,发现,咦,他的左右两边跟底下的“百度技术总监:互联网基础......”这段不太一样。

一开始不知道是margin:3rem 0;这个的原因,一个个class里的选择器删掉修改对应,最后发现确实是加了margin:3rem 0;这个表象原因。

那根本原因是什么呢,这块的图片、技术顾问:罗大佑”、“百度技术总监:互联网基础......”这三个东西,我把他们放在3个row里,而bootstrap为了让row和column之间像个齿轮一样是契合得很好,所以bootstrap设定是row的左右为负margin来着,所以就出现了这个问题。(应该是这样吧,不知道有没有理解错)

最后我把之前的margin值设置成margin:3rem -1.5rem;就解决了。(加了个负margin值)


4、整理一下轮播中遇到的问题。

因为js不懂,jquery也不懂,先整理出来遇到的问题,留待以后解决)

用那个unslider的时候:

(1)页面刷新之后第一张图显示的不是"作为一个初级菜鸟,你是否想要了解...."这张。我明明把它放在第一个li里。

(2)左右切换的按钮不是在要轮播的图片的左右,而是离轮播图片下方比较远的地方(竟然忘记记录具体有多远了)。

(3)小圆点明明选了 dot:true,却不显示,不知道哪里设置。

(4)明明把infinite设置成true,有的时候这个轮播切换得依然很晃眼。


【收获】

1、得到一个批量修改文件名的bat文件。

2、虚线的边框是dashed。eg:border:1px dashed rgb(0,0,0)

3、学到一个属性:box-shadow,是给"盒子"加阴影的。

语法是:box-shadow: h-shadow v-shadow blur spread color inset;

对应的每个值是:

h-shadow(必需):水平阴影的位置。允许负值。

v-shadow(必需):垂直阴影的位置。允许负值。

blur(可选):模糊距离。

spread(可选):阴影的尺寸。

color(可选):阴影的颜色。

inset(可选):将外部阴影 (outset) 改为内部阴影


(p.s:成果展示依然是未完成品;现在官网有了外门弟子这个设定了,我就不再在日报开头里加“我是老大钦点的外门弟子”这句话啦)

(哎呦。。今天忘记占坑了。。。超过12点了。。那只能明天和后天的日报写在一起了。或者明天的编辑到这一篇日报里来。。)


返回列表 返回列表
评论

    分享到