胖虎同学

flex 是 flexible Box 的缩写，意为"弹性布局"，用来为盒状模型提供最大的灵活性，任何一个容器都可以指定为 flex 布局。 当我们为父盒子设为 flex 布局以后，子元素的 float、clear 和 vertical-align 属性将失效。 给父盒子添加flex属性，来控制子盒子的位置和排列方式 父项常见属性 flex-direction：设置主轴的方向 justify-content：设置主轴上的子元素排列方式 flex-wrap：设置子元素是否换行 align-content：设置侧轴上的子元素的排列方式（多行） align-items：设置侧轴上的子元素排列方式（单行） flex-flow：复合属性，相当于同时设置了 flex-direction 和 flex-wrap flex-direction 设置主轴方向，在flex布局中分为主轴和侧轴（x、y轴），默认主轴是x轴，水平向右。 1234flex-direction: row; /*主轴为x轴，从左到右*/flex-direction: row-reverse; /*，...

meta标签 为使网站在移动端有理想的阅读宽度，需添加meta标签。 meta标签的目的：使布局视口的宽度与理想视口的宽度一致，简单理解就是设备有多宽，我们布局的视口就多宽。 1<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no,maximum-scale=1.0,minimum-scale=1.0"> width - viewport的宽度，width=device-width页面适应设备宽度 initial-scale - 初始的缩放比 minimum-scale - 允许用户缩放到的最小比例 maximum-scale - 允许用户缩放到的最大比例 user-scalable - 用户是否可以手动缩放，yes or no（1或0） 二倍图 物理像素&物理像素比 CSS 像素：又称为虚拟像素、设备独立像素或逻辑像素，也可以理解为直觉像素。CSS 像素是 Web 编程的概念，指的是 CSS 样式...

7月7日回到家，8.26号返校，不知不觉已经在家呆14天了，还有一个月就大二了…… 正如李宗盛《给自己的歌》中写道：“等你发现时间是贼了，它早已偷光你的选择”。想到第一次去学校的场景，现在还历历在目，一年的时间已经溜走，大学已完成了1/4，大学中能做的选择也已被偷走了1/4。 沉湎于过去毫无意义，过去已经不属于我了，我拥有的只有现在。我的人生就取决于当下。 《被讨厌的勇气》里有这样一段： 我有一位年轻朋友，虽然梦想着成为小说家，但却总是写不出作品。他说是因为工作太忙、写小说的时间非常有限，所以才写不出来作品，也从未参加过任何比赛。但真是如此吗？实际上，他是想通过不去比赛这一方式来保留一种“如果做的话我也可以”的可能性，即不愿出去被人评价，更不愿去面对因作品拙劣而落选的现实。他只想活在“只要有时间我也可以、只要环境具备我也能写、自己有这种才能”之类的可能性中。或许再过5年或者10年，他又会开始使用“已经不再年轻”或者“也已经有了家庭”之类的借口。 阿德勒心理学不同于弗洛伊德的“原因论”，ta主张的是“目的论”。一件事的结果不是由原因决定的，而是由目的决定的。上面的案例，那位梦想...

姥姥很节俭，很疼我。 姥姥和我是一庄的，姥爷走后，妈妈让我去姥姥家睡觉。姥姥睡东屋，我睡西屋。从五年级开始，我就在姥姥家住。 六年级后，我就要骑车去镇里上学了，骑车到镇上要三四十分钟时间，印象中五点四十五就要起床。姥姥不放心，也要早早地起床，怕我上学迟到、怕我忘带什么东西。我骑上车出发，姥姥一个人站在门口，望着我消失在视线中。 姥姥虽不识字，但很精明，从没被骗过。我想不被骗的原因，除了精明，还有就是节俭。不舍得为自己花一分钱，什么都不舍得买，什么都不舍得吃，冰箱里的食物放到发霉了也不舍得扔。这么精明节俭的一个人，竟然被骗了。唯一的一次被骗，是因为我。一天放学回家，姥姥说花200元给我买了本书，这本书能提高成绩。你看看有用吗，你爸妈非说我被骗了。我拿过书来随便看看，书很简陋，甚至从没听过，书的内容是关于简便计算，声称是不用笔算，口算出结果。我知道这本书没什么用，但还是说有用。姥姥欣慰的笑着说：“有用就好”。 考上高中了，姥姥比我还要高兴，但姥姥也很伤心。高中就要住宿了，两周才能回一次家，两周才能见一次姥姥。姥姥说最初两周见不到我很想我，一个人睡有些空落落的。 高三疫情时期，在家上网...

类似网站中的广告，点击关闭时消失，重新刷新页面再出现。 本质：让一个元素在页面中隐藏或者显示出来。 display display: none ；隐藏对象 display：block ；显示元素/转换为块元素 display 隐藏元素后，不再占有原来的位置。 visibility visibility：visible; 元素可视 visibility：hidden; 元素隐藏 visibility 隐藏元素后，仍占有原来的位置。 overflow overflow 属性指定在元素的内容太大而无法放入指定区域时是剪裁内容还是添加滚动条。 overflow 属性可设置以下值： visible - 默认。溢出没有被剪裁。内容在元素框外渲染 hidden - 溢出被剪裁，其余内容将不可见 scroll - 溢出被剪裁，同时添加滚动条以查看其余内容 auto - 与 scroll 类似，但仅在必要时添加滚动条 注释：overflow属性仅适用于具有指定高度的块元素。

定位 浮动可以让多个块级盒子一行没有缝隙排列显示， 经常用于横向排列盒子。 定位则是可以让盒子自由的在某个盒子内移动位置或者固定屏幕中某个位置，并且可以压住其他盒子。 定位=定位模式+边偏移 定位模式用于指定一个元素在文档中的定位方式。边偏移则决定了该元素的最终位置。 定位模式 1234position: static; /*静态定位*/position: relative; /*相对定位*/position: absolute; /*绝对定位*/position: fixed; /*固定定位*/ 边偏移 1234top: 20px; /*顶级偏移量，定义元素相对于父元素上边距的距离*/bottom: 20px; /*底部偏移量，定义元素相对于父元素下边距的距离*/left: 20px; /*左侧偏移量，定义元素相对于父元素左边距的距离*/right: 20px; /*右侧偏移量，定义元素相对于父元素右边距的距离*/ static 静态定位是元素的默认定位方式，无定位的意思。 1选择器 { position: static; } 静态定位按照标准流特性摆...

网页布局 标准流 块级元素：独占一行，从上向下顺序排列。 常用元素：div、hr、p、h1~h6、ul、ol、dl、form、table 行内元素：按照顺序从左到右顺序排列，碰到父元素边缘则自动换行。 常用元素：span、a、i、em等 以上都是标准流布局，标准流是最基本的布局方式。 浮动 定位 浮动 float属性用于创建浮动框，将其移动到一边，直到左边缘或右边缘触及包含块或另一个浮动框的边缘。 1float: left; /*right/none*/ 浮动和标准流的父盒子搭配。 先用标准流的父元素排列上下位置, 之后内部子元素采取浮动排列左右位置 一个元素浮动了，理论上其余的兄弟元素也要浮动。 一个盒子里面有多个子盒子，如果其中一个盒子浮动了，那么其他兄弟也应该浮动，以防止引起问题。 浮动的盒子只会影响浮动盒子后面的标准流,不会影响前面的标准流。 清除浮动 为什么要清除浮动 由于父级盒子很多情况下，不方便给高度，但是子盒子浮动又不占有位置，最后父级盒子高度为 0 时，就会影响下面的标准流盒子。 清除浮动本质 清除浮动的本质是清除浮动元素造成的影响...

边框 12345border-width/*定义边框粗细，单位px*/border-style /*边框样式 solid实先 dashed虚线 dotted点线 */border-color /*边框颜色*/border: 1px solid red; /*简写*/border-collapse:collapse; /*表示相邻边框合并*/ 内边距 padding内边距，即边框和内容之间的距离 1234567padding:5px; /*上下左右都有5像素内边距*/padding:5px 10px; /*上下5px，左右10px*/padding:5px 10px 20px; /*上内边距5px，左右10px，下20px*/padding:5px 10px 20px 30px; /*上5，右10，下20，左30*/ 外边距 margin 用于设置外边距，即控制盒子和盒子之间的距离。 块级盒子水平居中 外边距可以让块级盒子水平居中，但是必须满足两个条件： ①盒子必须指定了宽度（width）。 ②盒子左右的外边距都设置为auto 。 123456789.header{ w...

换新电脑了，开心o(￣▽￣)ブ 旧电脑有些年头了，太卡了，打开个VS Code都要卡好久，严重影响心情……趁着618在京东入手了荣耀Magicbook pro 2020，我的要求不高，能满足日常学习娱乐就行。新电脑体验不错，激活电脑后就在新电脑上部署了Hexo博客，参考了这篇教程。 在新电脑上部署Hexo 讲座 前不久听了一位学长的讲座，学长现在在字节跳动实习，做着我憧憬的工作👨‍💻。 学长是我们学院信科专业的，考上了北京理工大学的研究生。他讲了大学、考研、实习经历，听后我很佩服，也很羡慕。想起了薛兆丰的话，大意是：**看见别人打到鱼你也要打鱼，你有网吗？打鱼只要一天，织网呢？**是啊，我只看到了他收获的果实，却没看到他为此付出的努力。即使天资聪颖的人想要成功，都要付出努力，何况平庸的我呢！他做的是前端岗位，我也对前端很感兴趣。讲座后他展示了他的微信，我加了，但一直没敢聊天，内向+不知道说些什么…… 机会 在日常生活中，我们会得到很多机会，但我大都没把握住。 军训休息时，我们连和十二连一起做游戏。1v1蒙眼pk，最先碰到头的人胜。十二连的人都很积极，我们连仅有几个人参与，我也...

Typora 设置上传图片功能，图片可以自动提交到图床，大大提高了工作效率。如何将Typora编辑器中的图片上传到自己的图床，我们将用Typora+PicGo+Gitee实现图片上传。 Gitee 1.注册、登录码云 Gitee网址：https://gitee.com （注册登录操作不再介绍） 2.创建一个仓库当做图床 注意我标红的地方，然后选择创建就ok了。 3.创建私人令牌 找到设置——安全设置——生成新令牌 描述私人令牌，选择projects，提交。==复制令牌，可以记录在text等地方，稍后会用到。== PicGo 一款可以上传、管理图床的工具，支持腾讯图床、七牛图床等多种图床，可以自己探索。本篇用的是GItee图床。 1.下载、安装PicGo 下载地址：https://github.com/Molunerfinn/picgo/releases 选择自己的版本，下载安装即可。 2.安装Gitee插件 注：若没有 node.js ，无法安装Gitee插件。官网：https://nodejs.org/zh-cn 下载安装即可。 一切顺利，打开PicGO——插件设置—...