Skip to content

fandy 的个人小站 Posts

Featured Post

新域名!破站搬迁记录

Posted in 未分类

背景新

不知不觉我的(更新寥寥的)小站已经一年了,听说国内域名以后必须要备案,所以重新换了一个国外godaddy的域名.club, 顺手也换了套主题。这款主题虽然看起来有点性冷淡风,但自适应能力比之前的主题强多了,无论电脑还是手机上都能不错的显示。

网站搬迁过程中也遇到了很多困难,导致部分以前的图片丢失,有时间我会慢慢补(估计就是懒了),搬迁过程有时间我也会总结一下,有些东西真是不记下来就会很快忘掉。但归根结底还是相关知识掌握不够,对虚拟主机,域名,服务器之间的关系也不是很清楚,真不知道一年前的我是怎么成功的orz。但不管怎么说,目前基本算是把网站恢复了,以后我争取做个勤劳的博主,绝不立flag!

嗯,就这样吧

 

17年九月末补充:果然立了flag,咸鱼的本质难以改变orz

 

html前端学习知识堆积处(二)

Posted in 未分类

太长了分开存放,freecodecamp是个好东西

响应式框架Bootstrap

Bootstrap将会根据你的屏幕的大小来调整HTML元素的大小 —— 强调 响应式设计的概念。

通过响应式设计,你无需再为你的网站设计一个手机版的。它在任何尺寸的屏幕上看起来都会不错。

你仅需要通过添加下列代码到你的HTML开头来将Bootstrap添加到任意应用中:

<link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.1/css/bootstrap.min.css"/>

首先,我们需要把所有的HTML内容放在class为container-fluiddiv下。

如果图片的尺寸刚好等于我们手机的尺寸,那想必是极好的。

谢天谢地,通过Bootstrap,我们要做的只是给图片添加 img-responsive class属性。这样图片的宽度就能完美地适配你的页面的宽度了。

既然我们在使用Bootstrap,我们可以通过居中头部元素来使它看起来更棒。 我们所要做的只是把text-center class属性添加给 h2 元素。

html前端学习知识堆积处

Posted in 未分类

h1是主标题,h2是副标题,h3、h4、h5、h6依次递减字体的大小。

p 段落缩写

可以通过删除<!---->来删除注释。

以下是将你的h2元素的文本颜色设置为蓝色的示例代码:(inline style(内联样式))

<h2 style="color: blue">CatPhotoApp</h2>

层叠样式表CSS(Cascading Style Sheets)

<style>
选择器 {属性名称: 属性值;}
h2 {color: red;}
</style>

注意:一定要在属性值的后面加上分号;

————————————————————————

我们先声明一个类选择器:

<style>
.blue-text {
color: blue;
}
</style>

上面的代码在 <style> 标记中声明了一个叫做 blue-text 的类样式。

然后在h2元素上应用我们声明的类选择器:

<h2 class="blue-text">CatPhotoApp</h2>         (注意不加点)

注意:在CSS中,类选择器应该添加.为前缀。

而在HTML中,class属性不能添加.为前缀。

改变字号:h1 {
font-size: 30px;
}

如果你想把副标题的字体设置为Sans-serif,你可以使用下面的CSS:

h2 {
font-family: Sans-serif;
}

当某种字体不可用时,你可以让浏览器自动降级到另一种字体。

例如,如果你想让段落的字体为Helvetica,但你同时想在Helvetica字体不可用时自动降级使用Sans-Serif字体,你可以使用如下CSS样式:

p {
font-family: Helvetica, Sans-Serif;
}

使用img元素来为你的网站添加图片,使用src属性指向一个图片的具体地址。

举例如下:

<img src="https://www.your-image-source.com/your-image.jpg">

注意:img元素是自关闭元素,不需要结束标记。

设置图片尺寸:

如果我们想要创建一个名为larger-image的类选择器,把HTML元素的宽度设定为500像素,我们使用:

<style>
.larger-image {
width: 500px;
}
</style>

你可以应用多个class到一个元素,只需要在多个class之间用空格分开即可。例如:

<img class="class1 class2">

我们还可以通过CSS的一个叫border-radius(边框半径)的属性来让边框变成圆的(指定半径。。px或百分比)。

a元素,也叫anchor(锚点)元素,既可以用来链接到外部地址实现页面跳转功能,也可以链接到当前页面的某部分实现内部导航功能。

<p>Here’s a <a href=”http://freecodecamp.cn”> link to FreeCodeCamp中文社区 </a> for you to follow.</p>

有时你想为你的网站添加一个a元素,但此时你还不知道要将它们链接到哪儿,此时可以使用固定链接。

把你的a元素的href属性的值替换为一个#,别名hash(哈希)符号,将其变为一个固定链接。(href=#)

你可以通过把某元素嵌套进a元素使其变成一个链接。

把你的图片嵌套进a元素。举例如下:

<a href="#"><img src="/images/relaxing-cat.jpg"></a>

alt属性,也被称为alt text, 是当图片无法加载时显示的替代文本。alt属性对于盲人或视觉损伤的用户理解一幅图片中所描绘的内容非常重要,搜索引擎也会搜索alt属性。

你可以像下面例子中一样为img元素添加一个alt属性:

<img src="www.your-image-source.com/your-image.jpg" alt="your alt text">

HTML有一个特殊元素,用于创建unordered lists(无序列表), 或带项目符号的列表。

无序列表以<ul>元素开始,并包含一个或多个<li>元素。

例如:

<ul>
<li>milk</li>
<li>cheese</li>
</ul>

HTML有一个特殊元素,用于创建ordered lists(有序列表), 或数字编号列表。

有序列表以<ol>元素开始,并包含一个或多个<li>元素。

例如:

<ol>
<li>Garfield</li>
<li>Sylvester</li>
</ol>

创建一个form(表单)。

Text input(文本输入框)是用来获得用户输入的绝佳方式。

你可以用如下方法创建:

<input type="text">

注意,input元素是自关闭的。

占位符(placeholder text)是用户在input(输入)框输入任何东西之前放置在input(输入)框中的预定义文本。

你可以用如下方式创建占位符:

<input type="text" placeholder="this is placeholder text">

使用HTML来构建可以跟服务器交互的Web表单(form),通过给你的form元素添加一个action属性来达到此目的。

action属性的值指定了表单提交到服务器的地址。

例如:

<form action="/url-where-you-want-to-submit-form-data"></form>

<form action=”/submit-cat-photo”><input type=”text” placeholder=”cat photo URL”></form>(嵌套文本框)

让我们来为你的form添加一个submit(提交)按钮,点击这个按钮,表单中的数据将会被发送到你通过action属性指定的地址上。

下面是submit按钮的例子:(放在form内部)

<button type="submit">this button submits the form</button>

input属性里加required可以设为必填

多选一的场景就用radio button(单选按钮)

每一个单选按钮都应该嵌套在它自己的label(标签)元素中。

注意:所有关联的单选按钮应该使用相同的name属性。

下面是一个单选按钮的例子:(也放在form内部)

<label><input type="radio" name="indoor-outdoor"> Indoor</label>

注:input,img无需结束符但是button需要

checkboxes(复选按钮)

使用checked属性,你可以设置复选按钮和单选按钮默认被选中。

为此,只需在input元素中添加属性checked

div元素,也被称作division(层)元素,是一个盛装其他元素的通用容器。

所以可以利用CSS的继承关系把div上的CSS传递给它所有子元素。

你可以用<div>来标记一个div元素的开始,然后用</div>来标记一个div元素的结束。

你可以用 background-color 属性来设置一个元素的背景颜色。

例如,如果你想把一个元素的背景颜色设置为green,你应该把这些加到你的 style 元素中:

.green-background {
background-color: green;
}

除了 class属性之外,每一个 HTML 元素还可以使用 id 属性。

使用 id 属性有若干好处,一旦当你开始使用 jQuery 的时候你会有更深的体会。

id 属性应该是唯一的,虽然浏览器并不强制唯一,但基于最佳实践,这一点是被广泛认可的,所以请不要给一个以上的元素设置相同的 id 属性。

下面举例说明了如何设置h2 元素的id属性为cat-photo-app

<h2 id="cat-photo-app">

和类选择器一样,你也可以使用ID选择器来声明样式。

声明一个叫cat-photo-element的ID选择器 ,并设置背景色为绿色。:

#cat-photo-element {
background-color: green;
}

你可能早已经注意到了这点,所有的 HTML 元素本质上是小的矩形块,代表着某一小块区域。

有三个影响HTML元素布局的重要属性:padding(内边距)margin(外边距)border(边框)

元素的 margin 控制元素的 border 和元素实际所占空间的距离。

如果你将一个元素的 margin 设置为负值,元素将会变大。

有时你想要自定义元素,使它的每一个边具有不同的 padding

CSS 允许你使用 padding-toppadding-rightpadding-bottompadding-left来控制元素上右下左四个方向的 padding

margin同理

除了分别指定元素的 padding-toppadding-rightpadding-bottompadding-left 属性外,你还可以集中起来指定它们,举例如下:

padding: 10px 20px 10px 20px;

这四个值以顺时针方式排列:顶部、右侧、底部、左侧,简称:上右下左。

每一个 HTML 页面都有一个 body 元素,并且其 body 元素同样能够应用样式。

记住,你可以像对其他 HTML 元素一样对你的 body 元素应用样式,并且所有其他元素将继承你的 body 元素的样式。(单独改变某元素的演示会覆盖掉body

注意:在 HTML 中这些 class 如何排序是无所谓的。

然而,在 <style> 部分中 class 声明的顺序却非常重要,第二个声明总是比第一个具有优先权。

such as

<h1 class=”pink-text blue-text”>Hello World!</h1>

在发生冲突时,浏览器会使用最后的 CSS 声明。

但是并非只有这些,还有其他覆盖 CSS 的方法。such as id 属性

id 属性总是具有更高的优先级。

行内样式也行 in-line style

行内样式看起来是这样的:

<h1 style="color: green">

很多情况下,你会使用 CSS 库,这些库可能会意外覆盖掉你自己的 CSS。所以当你需要确保某元素具有指定的 CSS 时,你可以使用 !important

举例如下:

color: pink !important;

你是否知道在 CSS 中还有其他表示颜色的方法?其中的一种方法称作 hexadecimal code(十六进制编码),简写为 hex code

在 CSS 中,我们可以使用 6 位十六进制数字来表示颜色,每 2 位分别表示红色 (R)、绿色 (G) 和蓝色 (B) 成分。例如,#000000 是黑色,同时也是可能的数值中最小的。

在 CSS 中表示颜色的另一个方法是使用 rgb值。

代表黑色的 RGB 值看起来是下面的样子:

rgb(0, 0, 0)

代表白色的 RGB 值看起来是下面的样子:

rgb(255, 255, 255)

震惊!新年抽奖活动!评论就有好礼相送!

Posted in 杂七杂八

新的一年就要到来了,为了欢庆元旦,再加上最近steam冬季特惠,决定办个抽奖活动,奖品是果壳2018物种日历一个三份steam游戏

想参加抽奖就在文章下面评论一个~(禁止刷屏)然后元旦的时候我会随机抽四楼把礼物送出去,当然要是送不出去我就自己收着了^_^

下面是奖品的简单介绍:

首先是物种日历:

1920130510

当岁月凝结成文明,当我遇见你

果壳网的物种日历,每月一款动物插图,每日带你了解一个物种,非常有创意。这是我预售那天早起守在电脑前刷新好久才抢到的,一激动就买了两个,多出来的就送给有缘人啦

然后是三款steam游戏,也算是个游戏推荐了

  1. Getting over it

————我做的这个游戏, 是为了某种特定类型的人 为了伤害他们

在b站很火爆的游戏,抖M的最爱,想要锻炼平和的心态就来玩这款游戏吧

 

  1. Battleblock Theater

方块战斗人剧场,是一款有趣的合作(友尽)类游戏,可以单人也可以联机,我玩了一部分感觉很不错,对手残还算友好

1234

  1. shio

中文名叫汐,是一款考验耐性的,高难度的横板过关游戏,抖M的最爱,关键是画面设计的很赞,关卡大多很精致,强烈推荐

32332

最后预祝大家新年快乐,考研保研出国工作顺利~

 

发现c菌的个人博客!推广一波

Posted in 未分类

看cc视频时无意中发现c菌居然有运营很久的个人网站,还是基于wordpress建的!迅速去膜拜了一下,感觉看到了和做up主时截然不同的c菌呢

c菌的主站:http://www.cjun.club

从上面这个链接可以各个子博客(是个拥有。com域名的土豪)

有兴趣可以去看看,c菌粉丝200万,但看这个博客的人好像不是很多

 

非常佩服c,很多事情自己不是没有去想过,但是却不敢尝试,因此偶尔还是会嫌弃随波逐流的自己,希望自己能变得更勇敢一点吧

 

为期一个月的以色列游记(流水账)—海法篇

Posted in 杂七杂八

多图警告!!!

在以色列理工交换了一个月,收获颇丰。在此记录,一个是因为网上以色列的游记少得可怜,也是给自己健忘的大脑做个备份233

那么我们开始吧!

海法篇

海法是以色列第三大城市,山地很多,阳光强烈空气干燥,绿化却做得很到位,很有地中海城市的感觉

交通

海法是以色列唯一一个安息日公交不停运的城市,车票高达六谢克,不过办张公交卡可以换乘免费。这边的司机不仅开车还负责给你售票找钱,可谓个个是车神(经常边在山路上急转弯边给我们找零)。夜间也有一趟环城观光巴士200路,途径海法各主要景点,是欣赏夜景的绝佳方式

IMG_4481

上图为海法路边等车时随手一拍,加个滤镜就很有海报的感觉是不是~

教育

海法有两个著名大学,一个是海法大学,处在山顶的位置,建筑风格很现代,夜游海法大学别有一番风味,最重要的是可以欣赏到山下的万家灯火(左侧黑色区域就是地中海)

IMG_4518

站在海法大学的观景台上,踮起脚张开双臂,迎面吹来的海风会让你有种飞翔的错觉。当然坐下来,和好友边喝啤酒边聊天也是十分惬意

海法另一所大学就是以色列理工学院了,也就是我交换去的学校,这一个月的大多数时间都呆在这里。山路崎岖不平,学校处处充满了自然的气息(晚上有成群野猪出没!)很多建筑比较旧了,看起来不像海法大学那么现代,但校内设施非常不错,每个学院楼都配有图书馆,24小时机房,自习室和茶饮室IMG_3701

作为以色列最好的大学,我总算在懒散的以色列人中找到了一些勤奋的学霸,在这里的图书馆很少见到学生葛优躺着刷手机,大家主要的娱乐活动是游泳健身,以及每晚在学生中心办的舞会(单身狗们的大失败)让人充分感受到什么是健康生活IMG_4559

上图是茶饮室看到的的一张海报,一个人可以搞砸所有考试,但不是今天(所以今天尽情放松吧233)

旅游与美食

海法的购物中心和天津比起来不是很多,规模最大的也就和大悦城相似,餐厅价格。。。参考伦敦(所以想要活下来还是要靠自己的厨艺),欣慰的是菜的分量都很足尤其是肉类,女生的话两人点一份也可以考虑。最重要的一点是慎点甜品!慎点甜品!慎点甜品!尝一口你就理解为何运动量这么大的以色列人依旧肥得像气球

IMG_3752

图中甜品集冰淇淋,巧克力酱,软糖,奥利奥,奶油于一身,你值得拥有

 

经过长达一个月的拖更我终于继续更新了!


海法比不上耶路撒冷这么富有宗教色彩,也不像特拉维夫那么疯狂,所以游客还是相对较少的,主要景点就是巴哈伊空中花园

IMG_3524

这座依山而建的花园就是巴哈伊教派的圣地,给人的感觉就像在暴晒的阳光下白色沙漠里的一片绿洲。巴哈伊教真的是一个神秘的教派,它对基督教和伊斯兰教等其他宗教都有着包容的态度,也没有寺庙教堂等等特定的宗教场所,甚至该教派的先贤为了避免宗教纷争,规定信仰此教的人不能在圣地(也就是海法这里)长期居住,而是只能通过到圣地当短期的志愿者的形式来进行朝拜,这一切特征让我觉得这简直是最不像宗教的教派了。这样做的目的是不是为了向多数人的宗教做出的妥协我不得而知,但从这座花园被维护的情况确实可以感受出信徒们的虔诚。

IMG_3547

巴哈伊花园附近就算是海法的老城区,在这里不同信仰,来自不同国家的人居住在一起,却非常平静和谐,不过看房屋的老旧程度,这里的发展大概还是比不过新城

关于海法想说的大概就这么多,至于特拉维夫和耶路撒冷的部分以后会随缘更新(大概?),话说在这座城市的一个月里我抓了不少神奇宝贝,就拿这些战利品做结尾吧哈哈

IMG_3559

观犹太人大屠杀纪念馆的一点感想

Posted in 未分类

那就是犹太人的爱国主义教育真的是太成功了!

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

真的完了

 

 

 

 

 

 

 

 

 

 

 

 

 

好吧,以下其实只是为了记录一下这次旅程,提醒自己不要忘了曾有这样一段震撼的经历。

犹太人大屠杀纪念馆,从耶路撒冷中央火车站乘轻轨坐至终点站即可到达。不得不说这个纪念馆的设计处处都很用心,既有客观上对于二战战局发展的详细描述,又有细节之处犹太人生活的零星碎片。整个展览都在试图将你带入一种情感,而不是各种史料照片的无聊堆砌,大量的影像资料和文学作品的节选,都让整个参观显得不那么疲劳。这种爱国主义教育的成功,说不定就是犹太人增长民族自尊心,团结起来创造出财富和辉煌的秘诀呢。

(这是一封困在欧洲的犹太人的往来书信,让人痛心)

当然这些书信和故事也不都是压抑的:父亲为了安抚被送去伦敦避难的孩子给他寄去的卡通明信片,人们被送去集中营的路上从火车扔下去的“漂流瓶”,为了避免工作坊中的孩子们被送去集中营而被创作的童话故事,这一件件琐碎的物品,会让人觉得战乱中幸存的爱是多么伟大。



另外整个展馆的设计也很有意思,站在展馆出口朝身后看去,大部分展厅都处在黑暗之中,但当你从出口踏出的那一刻


豁然开朗

Matlab画图相关的乱七八糟代码寄存

Posted in 干货教程区

来自放弃治疗也不想整格式的咸鱼三天眼看假期结束郁郁寡欢的我

X

Y

 

备注

m×n

m×n

按列取坐标数据绘制n条曲线

X和Y必须具有相同的尺寸

1×n或n×1

m×n或n×m

自动匹配尺寸相同方向绘制m条曲线

任意四种组合,效果一样

m×n或n×m

1×n或n×1

同上

同上

1×1

1×n或n×1

绘制垂直X轴离散点

Y可以任意向量

1×n或n×1

1×1

绘制垂直Y轴离散点

X可以任意向量

(原来不用hold on也可以同时绘制多条曲线啊。。。)

plot(X1,Y1,LineSpec1,X2,Y2,LineSpec2,…) 

完全等效于 

plot(X1,Y1,LineSpec1,…)

hlod all

plot(X2,Y2,LineSpec2,…)

figure对象各种属性大全 http://www.madio.net/forum.php?mod=viewthread&tid=238814&from=portal

plot函数线形标记符与颜色的设定

线型

说明

标记符

说明

颜色

说明

实线(默认)

+

加号符

r

红色

双划线

o

空心圆

g

绿色

:

虚线

*

星号

b

蓝色

:.

点划线

.

实心圆

c

青绿色

 

 

x

叉号符

m

洋红色

 

 

s

正方形

y

黄色

 

 

d

菱形

k

黑色

 

 

^

上三角形

w

白色

 

 

v

下三角形

 

 

 

 

右三角形

 

 

 

 

左三角形

 

 

 

 

p

五角星

 

 

 

 

h

六边形