- 博客(19)
- 收藏
- 关注
原创 css + js实现图片放大预览器
css + js实现图片放大预览器<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
2021-08-09 21:51:22 416
原创 CSS vw / vh 移动端布局
CSS vw / vh 移动端布局移动端布局flex 布局 : 单维度适配为了可以适配移动端,页面元素需要高度和宽度同时等比例缩放移动端适配方案 rem 和 vw & vh比较remvw/vh需要不断修改html文字大小省去各种判断和修改需要媒体查询@media不需要@media需要flexable.js监测屏幕变化不需要额外监测什么是vw / vhvw 和 vh是一个相对单位(原理类似em或者rem)vw :viewport widt
2021-07-11 21:29:41 551
原创 CSS 视口 - viewport
CSS 视口 - viewport什么是视口视口-viewport 就是浏览器显示页面内容的屏幕区域。视口分类:布局视口 - 弃用 (deprecate)视觉视口 - 弃用 (deprecate)理想视口 - 开发主流布局视口 layout viewport一般移动设备的浏览器都默认设置了一个布局视口,用于解决早期的PC端页面在手机上显示的问题。iOS, Android基本都将这个视口分辨率设置为 980px,所以PC上的网页大多都能在手机上呈现,只不过元素看上去很小,一般默认可以通
2021-07-10 22:25:26 1275
原创 HTML/CSS 元素的类型block, inline, inline-block
HTML/CSS 元素的类型block, inline, inline-block<!-- 1. block --><div class="block-div">独占一行</div>standalone in one line<div class="block-div">我也独占一行</div><!-- 2. inline --><span class="inline-span">我是一个span</sp
2021-04-06 22:04:06 464
原创 vscode emmet 代码格式化
vscode html/css 写代码的一些快捷指令不定期更新。div.container>div.item.item$*9<!-- div.container>div.item.item$*9 --><div class="container"> <div class="item item1"></div> <div class="item item2"></div> <div cl
2021-04-06 17:07:15 269
原创 Angular 路由懒加载自定义模块
Angular 路由懒加载项目启动的时候不加载user模块,只有路由到user模块的时候才加载user模块user-routing.module.tsconst routes: Routes = [ { path:'', component:UserComponent },];app-routing.module.tsconst routes: Routes = [ { path:'user', //loadChildren:'./module/user/
2021-03-28 23:30:14 313
原创 Nodejs 学习笔记 - fs模块
Nodejs 学习笔记 fs模块fs.stat 检测是文件还是目录fs.mkdir 创建目录fs.writeFile 创建写入文件fs.appendFile 追加文件fs.readFile 读取文件fs.readdir 读取目录fs.rename 重命名fs.rmdir 删除目录fs.unlink 删除文件const fs = require('fs');// 1. fs.stat 检测是文件还是目录fs.stat("../demo05", (err, stat) =>{
2021-03-25 22:06:35 132
原创 Nodejs新手笔记
Nodejs新手笔记总结一下知识点Http - 1var api="http://www.baidu.com?name=zhangsan&age=20";var urlparse = url.parse(api, true); //启用了var newUrl = new URL(api); // 新的方法解析URLconsole.log(urlparse);console.log(newUrl);console.log(urlparse.query);console.log
2021-03-23 23:29:04 133
原创 Angular 单元测试-提取公共方法
Angular 单元测试-提取公共方法可以重用的测试代码可以提取到单独的文件。创建一个common.spec.ts( 名字随便起 )写入公共代码到common.spec.ts 并exportimport { HttpService } from '../services/http/http.service';function prepareAll() { const filePath = 'assets/UTData/http-get-test.json'; // 真实数据存在
2021-03-17 22:56:46 374
原创 Angular Unit Test 单元测试HttpClient并模拟其Get()方法
Angular Unit Test 单元测试HttpClient测试一个注入HttpClient模块的服务http.service.ts,测试其中的httpGet()方法http.service.tsimport { Observable } from 'rxjs';import { Injectable } from '@angular/core';import { HttpClient } from '@angular/common/http';import axios from 'axi
2021-03-17 00:02:57 717
原创 Angular Unit Test 单元测试异步方法
Angular Unit Test 单元测试异步方法点我测试对象代码.import { AsyncService } from './async.service';describe('AsyncService', () => { let service: AsyncService; beforeEach(() => { // TestBed.configureTestingModule({}); // service = TestBed.inject(Async
2021-03-15 21:20:56 884
原创 Angular 003 依赖注入自定义服务实现异步处理
Angular 003 组件注入自定义服务-实现异步处理服务AsyncService,用timeout来模拟异包装异步方法import { Injectable } from '@angular/core';import { Observable } from 'rxjs';@Injectable({ providedIn: 'root'})export class AsyncService { constructor() { }// 同步方法 getData(input:st
2021-03-15 21:15:51 321
原创 Angular 003 绑定 Binding
Angular 003 绑定 Binding单向数据绑定export class NgBindingComponent implements OnInit { public title:string="我是标题"; public userInfo:any={ tel:10086, userName:"Derek" } public rockMusic:any[]=[ { rockType:"Punk", band:"反光镜",
2021-03-14 01:08:36 275
原创 Angular 002 创建组件,组件的模板
Angular 002 创建组件,组件的模板创建组件指令 ng g component 在Components目录下创建一个home组件的指令ng g component Components/home.创建后系统会生成4个文件home.component.html : html就是所谓的模板home.component.scss : 样式文件,后缀.scss是因为我们创建项目选的scsshome.component.spec.ts 单元测试文件。home.component.ts 业务逻
2021-03-13 22:39:17 329
原创 Angular Unit Test 断言总结
Angular Unit Test 21 断言总结// toEqual var arr1 = [1,2]; var arr2 = [1,2]; //expect(arr1).toBe(arr2); 结果false--toBe表示=== expect(arr1).toEqual(arr2); //true// toMatch(Regex or string)正则断言 var value3 = 'I am using Angular Unit Test';
2021-03-12 22:44:29 385
原创 Angular Unit Test 单元测试01
Angular Unit Test 单元测试01完成一个测试用例最基础的4个概念:// 测试细则套件describe(description: string, specDefinitions: () => void): void;// 预处理函数beforeEach(() => {})// 定义细则,包含若干测试预期it (‘specDesc, fn’)// 预期expect(val1).toBe(val2);describe('NgBindingComponent'
2021-03-12 22:05:29 732
原创 Angular 学习笔记 001 文件结构
Angular 学习笔记 001 文件结构废话不说直接上图看完了框架基本目录结构之后我们来看看代码文件夹src/app里面的根模块。
2021-03-12 16:16:39 283 6
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人