Posts

Summary JS 中的一切变量皆为对象，可以将对象理解为一个包含相关数据和方法的集合（变量 & 函数）我们也将其称之为属性和方法，就像我们在 python 里做的那样，本篇为 mdn_JS对象基础 ，mdn_JS对象原型 的阅读笔记 ...

Summary web-js 中主要的编程方式就是需要结合browser 的事件和属性来实现对页面的动态控制，事件章节可以说是web 动态编程中的核心部分了，了解主要存在和需要被控制的事件是相当重要的。 常见的浏览器事件 下面列出一些常见的事件类型和具体事件，更多的事件可以参考Mdn ，在设计页面的时候可以考虑我们希望获得什么效果来找寻是否有对应的事件来构建对应的动态响应。 ...

JS 基础语法 该部分的学习除了 MDN 的相关知识，会结合数据结构的内容来进行学。 语言的第一印象和 python 有许多相似的地方。语法上可能大差不差，在循环和其他一些变量上又有一些和 C#,CPP 相似的地方。 Basic Rules 基础规则简介 首先介绍基本的编写规则:如注释、缩进规则、变量规则等… 注释：CPP 相同使用 // 和 /* */ 进行行/块注释。 句尾 ; ：单行单条语句结束可以无需 ; (但为了规范和明确可以加上)，同行多个语句可以用 ; 进行语句的区分。 变量 声明变量使用：var , let , const 三个关键词；其中 let 和 const 是相似的，用于声明块级作用域的局部变量，只有在声明的位置之后才能使用，唯一的区别在于 const 声明的常量不能用赋值运算符直接更改，（但如果是个对象，它的属性可以被添加、更新、删除） 变量定义：(另起一个 Paragraph 表示尊重) JS 为非强类型语言(即类似 python 而非 cpp)，为动态类型语言，变量声明无需指定类型。但有以下几个注意的事项： （不推荐）不带关键字的变量声明会默认为全局变量。 （推荐）可以使用 let 或 var 关键字定义变量。 （最推荐）最推荐使用 let 进行变量的声明，var 对变量定义位置的要求更低，使用 var 编写可能会方便，但是在后续维护和阅读中可能会体验很差。使用 let 然后和别的语言一样声明和使用变量。 可以使用 typeof 来检查变量类型 其中对于变量的定义上，Var 和 let 的详细差别可以参考 var与let的区别 ，var变量提升 ，简单的讲 var 的定义会先于所有的语句执行，声明一个全局的变量。下面简单介绍一下各种不同的数据类型： ...

Summary 本篇读书笔记主要记录书中一些投资理财相关的概念、一些思维方式、一些典型的策略等等，用于自己后续理财的基础。 “投资理财越早开始越好，无需拘泥于启动资金的多少，时间才是投资理财中最重要的增长因子”。 财务自由 需要多少钱才能财富自由 4%法则（William Bengen）：通过投资一组资产，每年从退休金中提取不超过 4%的金额用来支付自己的生活所需，那么直到自己趋势，退休金都花不完。 ...

Summary 设计个人首页作为 HTML 和 CSS 的实战，主要设计以下的几个部分，导航栏，侧边栏，logo，页脚，背景，以及一个简单的个人介绍页面，首先不考虑使用框架和库，仅对整体流程做熟悉，使用纯 HTML 和 CSS 进行基础实现。后续考虑使用框架和组件库进行重写。 ...

响应式设计的历史和思路： 媒介查询的入门 与或非等语句 传统的布局方法 尽可能使用现代的布局方法，我们可能不需要媒介查询的方式去实现响应式设计了，当然我们也可以结合媒介查询去对现代布局方式做优化。

Summary 这里 CSS 的布局指的是通过控制元素的属性：宽度，高度，块（不同类型），内联等来实现在 HTML 的基础上对整体页面的布局进行调整。将其排布在页面上。 ...

Summary 这一章节主要是涵盖开发 css 的各部分，有一些需要掌握的技能的 TODO 还有一些代码风格之类的东西 ...

Summary 表格的部分主要还是要实操，MDN 中给了一个例子，这里给我的启示是要更多的去阅读表格的相关属性 ，或者去阅读别人对表格设计中用到的元素，才能更好的掌握一些设计的思路，这里就给出本文中给出的一些常见的属性和设置方法，后续在具体实践中慢慢补充。 css table{ table-layout: fixed; width: 100%; border-collapse: collapse; border: 3px solid purple; } thead th:nth-child(1) { width: 30%; } thead th:nth-child(2) { width: 20%; } thead th:nth-child(3) { width: 15%; } thead th:nth-child(4) { width: 35%; } th, td { padding: 20px; } 当为表格设置初始样式的时候，使用 layout 为 fixed 会使得表格的行为更好预测，避免由于内容产生的畸变导致难以设置或者出现一些奇怪对齐情况，使用 fixed 然后设置每一列的宽度，在对内容进行处理可能更好。 使用 nth-child 设置每一列的宽度，最终相加为 100%，使得在不同分辨率下比较好控制。 border-collapse: collapse; 原本两个格子之间会有两条边线，这样的话可以合并重叠的边线，让表格更符合我们的预期。 使用 text-align 设置对齐方式 使用 thead，tfoot，tbody 来分别设置样式，可以做出类似三线表之类的东西 为标题 caption 设置对应的样式 后续可能会找一些比较常见的表之类的来整理，& 查看一下组件库。 ...

Summary 该篇章主要收集一些常见的样式设置的参考页和一些需要记住的重要设置内容，由于不可能记住所有的属性和设置，善用查询可能才是唯一的王道。 CSS 中的值与单位 CSS 中的值与单位 这里介绍常见的一些值和单位，有一些新的可能会有所缺失，但是大部分都有了，这里可以列举几个常见但是之前不理解的。 ...