weixin_44682587的博客

原创 CSS制作“三角”（对话框突出部分）

CSS制作“三角” 看以下的css渲染结果： .box1 { width:0; height: 0; border-top: 10px solid pink; border-right: 10px solid red; border-bottom: 10px solid blue; border- left: 10px solid green; } 简单修改以下，只保留一个： .box2 { width: 0; height: 0; border: 10px solid trans

原创 css中的定位

CSS定位 ** 定位组成** 定位∶将盒子定在某一个位置，所以定位也是在摆放盒子，按照定位的方式移动盒子。定位=定位模式＋边偏移。 定位模式用于指定一个元素在文档中的定位方式。边偏移则决定了该元素的最终位置。 边偏移 边偏移就是定位的盒子移动到最终位置。有top、bottom、left和right 4个属性。 静态定位static 静态定位是元素的默认定位方式，无定位的意思。 语法︰ { position: static; } 静态定位按照标准流特性摆放位置，它没有边偏移 静态定位在布局时很少用

原创 CSS的复合选择器

CSS的复合选择器 后代选择器 子选择器 并集选择器 使用举例： div, p, .pig li { color: pink; } 注意： 约定的语法规范，我们并集选择器喜欢竖着写 最后一个选择器不需要加逗号 伪类选择器 伪类选择器用于向某些选择器添加特殊的效果，比如给链接添加特殊效果，或选择第1个，第n个元素。 伪类选择器书写最大的特点是用冒号(∶)表示，比如 :hover 、:first-child。 因为伪类选择器很多，比如有链接伪类、结构伪类等，所以这里先给大家讲解常用的链接伪

原创 TypeScript中的泛型

TypeScript中的泛型 用途：在写ts代码声明变量、函数或类时，往往需要添加属性注解，声明变量或参数的数据类型，但是在实际开发中有些类型往往不确定，或者有多重类型，这种情况可以“泛指”出来，使用泛型解决问题。 在定义函数或是类时，如果遇到类型不明确就可以使用泛型。 使用示例： function fn<T>(a: T): T { return a; } // 可以直接调用具有泛型的函数 let result = fn( a: 10); // 不指定泛型，TS 可以自动对类型进行推断 l

原创 TypeScript中的属性封装

TypeScript中的属性封装 在学 Javaweb 时，mvc架构 其中 model层 中封装的都是 实体类，实体类中包括 getter、setter方法 等内容，这种代码风格使项目结构比较清晰。 TypeScript 中的属性封装类似于Javaweb中mvc架构中的 model层。 传统JavaScript对象属性封装出现的问题： 属性是在对象中设置的，属性可以任意的被修改 属性可以任意被修改将会导致对象中的数据变得非常不安全 TS可以在属性前添加属性的修饰符 public 修饰的属性可以在

原创 TypeScript中的接口和抽象类

TypeScript中的接口 1. 对象的类型注解 语法说明 对象类型注解的语法类似于对象自身的语法。 注意：键值对中的值是类型!（因为这是对象的类型注解）。 注意：多个键值对之间使用分号（;）分隔，并且分号可省略。 2. 对象方法的类型注解 举例： 接口的使用 注意： 接口可以在定义类的时候去限制类的结构 接口中的所有的属性都不能有实际的值 接口只定义对象的结构，而不考虑实际值 在接口中所有的方法都是抽象方法 举例： interface myInter{ name: string;

原创 Emmet语法

Emmet语法 快速生成HTML结构语法 生成标签直接输入标签名按tab键即可，比如 div 然后 tab 键，就可以生成<div></div> 如果想要生成多个相同标签加上*就可以了，比如 div*3 就可以快速生成 3 个 div 如果有父子级关系的标签，可以用 >，比如 ul > li 就可以了 如果有兄弟关系的标签，用＋就可以了比如 div+p 如果生成带有类名或者id名字的，直接写 .demo 或者 #two tab键 就可以了 如果生成的 div类名 是有

原创 TypeScript中的类

原创 TypeScript函数

原创 TypeScript中的变量

变量基本使用 变量的使用分为两步: 声明变量并指定类型 给变量赋值 let age: number; let name: number = "LiBai"; // : number 是类型注解 解释: let 是 TS 的关键字，用来声明变量。 age 是程序员自己定义的变量名称。 : number 用来指定变量 age 为数值类型。 注意: 分号(包括后面数值类型部分)是可选的，可省略。 类型注解 类型注解: 是—种为变量添加类型约束的方式。 程序员和Ts有个约定。 // 程序员和TS 约定:变量

原创 初识TypeScript

初识TypeScript TypeScript是JavaScript的超集，支持所有的JavaScript语法，在JavaScript的基础上增加了其他语法和功能。 安装解析TS的工具包 打开vSCode终端。 输入安装命令: npm i -g typescript回车。i（install）: 表示安装。-g (–global) : 全局标识，可以在任意目录中使用该工具。 typescript: 就是用来解析Ts的工具包。提供了tsc命令，实现了TS->JS的转化。 npm: 用来安装前端开发中

原创 运行ts-node xxx.ts报错：Cannot find module ……

执行ts-node xxx.ts报错： error: Cannot find module ‘@types/node/package.json’ 解决方法： npm install -d tslib @types/node