diff --git a/README.md b/README.md
index e1e69bb..2431771 100644
--- a/README.md
+++ b/README.md
@@ -1,27 +1 @@
-# LearnNg
-
-This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 13.0.3.
-
-## Development server
-
-Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
-
-## Code scaffolding
-
-Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
-
-## Build
-
-Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory.
-
-## Running unit tests
-
-Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
-
-## Running end-to-end tests
-
-Run `ng e2e` to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.
-
-## Further help
-
-To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.
+# 自己搭建的一个基于 Angular13 的脚手架
diff --git a/package-lock.json b/package-lock.json
index 6a02114..a1a0ee3 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -16,6 +16,7 @@
         "@angular/platform-browser": "~13.0.0",
         "@angular/platform-browser-dynamic": "~13.0.0",
         "@angular/router": "~13.0.0",
+        "normalize-scss": "^7.0.1",
         "rxjs": "~7.4.0",
         "tslib": "^2.3.0",
         "zone.js": "~0.11.4"
@@ -7661,6 +7662,11 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/normalize-scss": {
+      "version": "7.0.1",
+      "resolved": "https://registry.npmmirror.com/normalize-scss/-/normalize-scss-7.0.1.tgz",
+      "integrity": "sha512-qj16bWnYs+9/ac29IgGjySg4R5qQTp1lXfm7ApFOZNVBYFY8RZ3f8+XQNDDLHeDtI3Ba7Jj4+LuPgz9v/fne2A=="
+    },
     "node_modules/npm-bundled": {
       "version": "1.1.2",
       "resolved": "https://registry.npmmirror.com/npm-bundled/-/npm-bundled-1.1.2.tgz",
@@ -17853,6 +17859,11 @@
       "integrity": "sha512-bdok/XvKII3nUpklnV6P2hxtMNrCboOjAcyBuQnWEhO665FwrSNRxU+AqpsyvO6LgGYPspN+lu5CLtw4jPRKNA==",
       "dev": true
     },
+    "normalize-scss": {
+      "version": "7.0.1",
+      "resolved": "https://registry.npmmirror.com/normalize-scss/-/normalize-scss-7.0.1.tgz",
+      "integrity": "sha512-qj16bWnYs+9/ac29IgGjySg4R5qQTp1lXfm7ApFOZNVBYFY8RZ3f8+XQNDDLHeDtI3Ba7Jj4+LuPgz9v/fne2A=="
+    },
     "npm-bundled": {
       "version": "1.1.2",
       "resolved": "https://registry.npmmirror.com/npm-bundled/-/npm-bundled-1.1.2.tgz",
diff --git a/package.json b/package.json
index 6adc5f5..4cfdaed 100644
--- a/package.json
+++ b/package.json
@@ -3,7 +3,7 @@
   "version": "0.0.0",
   "scripts": {
     "ng": "ng",
-    "start": "ng serve",
+    "start": "ng serve --open",
     "build": "ng build",
     "watch": "ng build --watch --configuration development",
     "test": "ng test"
@@ -18,6 +18,7 @@
     "@angular/platform-browser": "~13.0.0",
     "@angular/platform-browser-dynamic": "~13.0.0",
     "@angular/router": "~13.0.0",
+    "normalize-scss": "^7.0.1",
     "rxjs": "~7.4.0",
     "tslib": "^2.3.0",
     "zone.js": "~0.11.4"
diff --git a/src/app/app.component.html b/src/app/app.component.html
index 38ea303..4cbe716 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -4,7 +4,7 @@
  * @Author: Ruin 🍭
  * @Date: 2022-03-03 16:21:23
  * @LastEditors: 刘引
- * @LastEditTime: 2022-03-04 11:00:55
+ * @LastEditTime: 2022-03-04 15:50:32
 -->
 
 <!-- 路由配置后显示的区域 -->
diff --git a/src/app/app.component.scss b/src/app/app.component.scss
index 62c165e..2369822 100644
--- a/src/app/app.component.scss
+++ b/src/app/app.component.scss
@@ -1,8 +1 @@
-* {
-  margin: 0;
-  padding: 0;
-}
-.w {
-  width: 1200px;
-  margin: 0 auto;
-}
+@import "../../node_modules/normalize-scss/sass/normalize";
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index e714d1f..41c2d71 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -4,18 +4,18 @@
  * @Author: Ruin 🍭
  * @Date: 2022-03-03 16:21:23
  * @LastEditors: 刘引
- * @LastEditTime: 2022-03-04 10:09:24
+ * @LastEditTime: 2022-03-04 15:49:55
  */
 // 引入核心模块
-import { NgModule } from '@angular/core';
+import { NgModule } from "@angular/core";
 // 引入浏览器解析模块
-import { BrowserModule } from '@angular/platform-browser';
+import { BrowserModule } from "@angular/platform-browser";
 // 引入路由模块
-import { AppRoutingModule } from './app-routing.module';
+import { AppRoutingModule } from "./app-routing.module";
 // 引入根组件
-import { AppComponent } from './app.component';
+import { AppComponent } from "./app.component";
 // @ngModule装饰器 @ngModule接受一个元数据对象 告诉angular如何编译和启动对象\
-import { CoreModule } from './core/core.module';
+import { CoreModule } from "./core/core.module";
 
 @NgModule({
   declarations: [AppComponent], //配置项目运行的组件
diff --git a/src/app/components/components.module.ts b/src/app/components/components.module.ts
index 416d959..28c4f2f 100644
--- a/src/app/components/components.module.ts
+++ b/src/app/components/components.module.ts
@@ -4,12 +4,12 @@
  * @Author: Ruin 🍭
  * @Date: 2022-03-03 16:58:41
  * @LastEditors: 刘引
- * @LastEditTime: 2022-03-04 10:54:07
+ * @LastEditTime: 2022-03-04 15:44:31
  */
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { NewsComponent } from './news/news.component';
-import { ListComponent } from './list/list.component';
+import { NgModule } from "@angular/core";
+import { CommonModule } from "@angular/common";
+import { NewsComponent } from "./news/news.component";
+import { ListComponent } from "./list/list.component";
 
 @NgModule({
   declarations: [NewsComponent, ListComponent],
diff --git a/src/app/components/list/list.component.html b/src/app/components/list/list.component.html
index 7c1fe15..4ce59a2 100644
--- a/src/app/components/list/list.component.html
+++ b/src/app/components/list/list.component.html
@@ -1 +1,18 @@
-<p>list works!</p>
+<!--
+ * @Description: {{ByRuin}}
+ * @Version: 2.0
+ * @Author: Ruin 🍭
+ * @Date: 2022-03-04 10:47:32
+ * @LastEditors: 刘引
+ * @LastEditTime: 2022-03-04 14:21:15
+-->
+<div class="root">
+  <header>
+    <h2>管道的相关用法</h2>
+  </header>
+  <article>
+    <div class="time">
+      {{ today | date: "yyyy-MM-dd HH:mm:ss" }}
+    </div>
+  </article>
+</div>
diff --git a/src/app/components/list/list.component.ts b/src/app/components/list/list.component.ts
index 011aa13..5ea87ff 100644
--- a/src/app/components/list/list.component.ts
+++ b/src/app/components/list/list.component.ts
@@ -1,15 +1,24 @@
-import { Component, OnInit } from '@angular/core';
+/*
+ * @Description: {{ByRuin}}
+ * @Version: 2.0
+ * @Author: Ruin 🍭
+ * @Date: 2022-03-04 10:47:32
+ * @LastEditors: 刘引
+ * @LastEditTime: 2022-03-04 14:39:52
+ */
+import { Component, OnInit } from "@angular/core";
 
 @Component({
-  selector: 'app-list',
-  templateUrl: './list.component.html',
-  styleUrls: ['./list.component.scss']
+  selector: "app-list",
+  templateUrl: "./list.component.html",
+  styleUrls: ["./list.component.scss"],
 })
 export class ListComponent implements OnInit {
+  public today: any = new Date();
 
-  constructor() { }
-
-  ngOnInit(): void {
+  constructor() {
+    console.log(this.today);
   }
 
+  ngOnInit(): void {}
 }
diff --git a/src/app/components/news/news.component.html b/src/app/components/news/news.component.html
index d34c31c..e2b033c 100644
--- a/src/app/components/news/news.component.html
+++ b/src/app/components/news/news.component.html
@@ -1 +1,27 @@
-<p>{{ msg }}</p>
+<!--
+ * @Description: {{ByRuin}}
+ * @Version: 2.0
+ * @Author: Ruin 🍭
+ * @Date: 2022-03-03 16:59:15
+ * @LastEditors: 刘引
+ * @LastEditTime: 2022-03-04 15:34:24
+-->
+<div class="root">
+  <div class="w">
+    <div class="container">
+      <h2>事件的相关用法</h2>
+      <div class="demo">
+        <button (click)="getNum()">执行事件</button>
+        <button (click)="getData()">获取数据</button>
+        <button (click)="setData()">改变数据</button>
+        <button (click)="changeDom($event)">更高按钮颜色</button>
+      </div>
+
+      <div class="demo2">
+        <!-- 传递input输入框中的值 -->
+        <input (keydown)="pressKeyboard($event)" type="text" />
+      </div>
+      <p>{{ msg }}</p>
+    </div>
+  </div>
+</div>
diff --git a/src/app/components/news/news.component.ts b/src/app/components/news/news.component.ts
index da1a0f3..80d2b92 100644
--- a/src/app/components/news/news.component.ts
+++ b/src/app/components/news/news.component.ts
@@ -4,22 +4,44 @@
  * @Author: Ruin 🍭
  * @Date: 2022-03-03 16:59:15
  * @LastEditors: 刘引
- * @LastEditTime: 2022-03-04 10:56:36
+ * @LastEditTime: 2022-03-04 14:58:48
  */
 
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit } from "@angular/core";
 
 @Component({
-  selector: 'app-news',
-  templateUrl: './news.component.html',
-  styleUrls: ['./news.component.scss'],
+  selector: "app-news",
+  templateUrl: "./news.component.html",
+  styleUrls: ["./news.component.scss"],
 })
 export class NewsComponent implements OnInit {
-  public msg: string = '我是新闻模块';
-  constructor() {
-    console.log(this.msg);
-    this.msg = '我是改变后msg的值';
+  public msg: string = "我是新闻模块";
+  constructor() {}
+  ngOnInit(): void {}
+  getNum() {
+    alert("执行方法");
+  }
+  getData() {
     console.log(this.msg);
   }
-  ngOnInit(): void {}
+  setData() {
+    this.msg = "我是再次改变的msg";
+  }
+  pressKeyboard(e: any) {
+    // keyCode为13代表回车
+    if (e.keyCode === 13) {
+      // e.target.value 代表获取dom元素中input输入框中的值
+      console.log("按下了回车", e.target.value);
+    } else {
+      //获取当前输入的值
+      console.log(e.code);
+      // 获取按键的代号
+      console.log(e.keyCode);
+    }
+  }
+  changeDom(e: any): any {
+    // 操作dom更改字体颜色
+    e.target.style.color = "red";
+    console.log(e.target.style);
+  }
 }
diff --git a/src/app/core/core.module.ts b/src/app/core/core.module.ts
index cb97f84..1cfa4fb 100644
--- a/src/app/core/core.module.ts
+++ b/src/app/core/core.module.ts
@@ -4,16 +4,14 @@
  * @Author: Ruin 🍭
  * @Date: 2022-03-03 16:48:51
  * @LastEditors: 刘引
- * @LastEditTime: 2022-03-04 10:29:19
+ * @LastEditTime: 2022-03-04 15:50:01
  */
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { PagesModule } from '../pages/pages.module';
-import { ComponentsModule } from '../components/components.module';
-
+import { NgModule } from "@angular/core";
+import { PagesModule } from "../pages/pages.module";
+import { ComponentsModule } from "../components/components.module";
 @NgModule({
   declarations: [],
-  imports: [CommonModule, PagesModule, ComponentsModule],
+  imports: [PagesModule, ComponentsModule],
   exports: [PagesModule, ComponentsModule],
 })
 export class CoreModule {}
diff --git a/src/app/pages/home/components/body/body.component.html b/src/app/pages/home/components/body/body.component.html
index b3115a2..a30694e 100644
--- a/src/app/pages/home/components/body/body.component.html
+++ b/src/app/pages/home/components/body/body.component.html
@@ -4,20 +4,32 @@
  * @Author: Ruin 🍭
  * @Date: 2022-03-03 17:07:23
  * @LastEditors: 刘引
- * @LastEditTime: 2022-03-04 11:30:17
+ * @LastEditTime: 2022-03-04 13:35:29
 -->
-<p>body {{ content }}</p>
-<!-- 渲染html标签 -->
-<span [innerHTML]="content"></span>
-<!-- 进行简单计算 -->
-<span>1+2 = {{ 1 + 2 }}</span>
-<!-- 使用数据 -->
-<hr />
-<div>
-  <head>
-    开始进行数组循环渲染
-  </head>
-  <ul>
-    <li *ngFor="let item of arrList">{{ item }}</li>
-  </ul>
+<div class="root">
+  <p>body {{ content }}</p>
+  <!-- 渲染html标签 -->
+  <span [innerHTML]="content"></span>
+  <!-- 进行简单计算 -->
+  <span>1+2 = {{ 1 + 2 }}</span>
+  <!-- 使用数据 -->
+  <hr />
+  <div>
+    <head>
+      开始进行数组循环渲染
+    </head>
+    <ul>
+      <li *ngFor="let item of arrList">{{ item }}</li>
+    </ul>
+  </div>
+  <hr />
+  <h5>引入图片</h5>
+  <div>
+    <span>引入本地图片</span>
+    <img src="assets/images/home/cat.png" alt="" />
+  </div>
+  <div>
+    <span>引入网络图片</span>
+    <img [src]="picUrl" alt="无法显示" />
+  </div>
 </div>
diff --git a/src/app/pages/home/components/body/body.component.scss b/src/app/pages/home/components/body/body.component.scss
index e69de29..fbd5da1 100644
--- a/src/app/pages/home/components/body/body.component.scss
+++ b/src/app/pages/home/components/body/body.component.scss
@@ -0,0 +1,5 @@
+.root {
+  div img {
+    vertical-align: middle;
+  }
+}
diff --git a/src/app/pages/home/components/body/body.component.ts b/src/app/pages/home/components/body/body.component.ts
index bf53b07..cda665d 100644
--- a/src/app/pages/home/components/body/body.component.ts
+++ b/src/app/pages/home/components/body/body.component.ts
@@ -4,18 +4,20 @@
  * @Author: Ruin 🍭
  * @Date: 2022-03-03 17:07:23
  * @LastEditors: 刘引
- * @LastEditTime: 2022-03-04 11:31:45
+ * @LastEditTime: 2022-03-04 13:34:58
  */
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit } from "@angular/core";
 
 @Component({
-  selector: 'app-body',
-  templateUrl: './body.component.html',
-  styleUrls: ['./body.component.scss'],
+  selector: "app-body",
+  templateUrl: "./body.component.html",
+  styleUrls: ["./body.component.scss"],
 })
 export class BodyComponent implements OnInit {
-  public content = '<h2>我是一个H2标签</h2>';
+  public content = "<h2>我是一个H2标签</h2>";
   public arrList: Array<Number> = [1111, 222, 333, 444, 555];
+  public picUrl: string =
+    "http://img7.dl.ltimg.net/emoji/egg/5c4055492549591e51027e88?imageView2/1/w/300/h/300&sign=870d77486943cef24b9208b37ae48f07&t=6221b257";
   constructor() {}
   ngOnInit(): void {}
 }
diff --git a/src/app/pages/home/components/head/head.component.html b/src/app/pages/home/components/head/head.component.html
index 0815a7d..0ab76f5 100644
--- a/src/app/pages/home/components/head/head.component.html
+++ b/src/app/pages/home/components/head/head.component.html
@@ -4,7 +4,38 @@
  * @Author: Ruin 🍭
  * @Date: 2022-03-03 17:07:14
  * @LastEditors: 刘引
- * @LastEditTime: 2022-03-04 11:04:54
+ * @LastEditTime: 2022-03-04 14:11:19
 -->
-<p>{{ userName }}{{ title }}</p>
-<p [title]="userName">我是一个p标签</p>
+<div class="root">
+  <div class="demo1">
+    <h2>1.循环数据显示数据的索引</h2>
+    <ul>
+      <li *ngFor="let item of newsList; let key = index">
+        <span [class]="key === 1 ? 'red' : ''">
+          {{ key + 1 }} {{ item.title }}
+        </span>
+      </li>
+    </ul>
+  </div>
+
+  <div class="demo2">
+    <h2>2.条件判断语句</h2>
+    <img src="assets/images/home/cat.png" alt="" *ngIf="flag == true" />
+  </div>
+
+  <div class="ng-switch">
+    <h2>3.switch条件判断</h2>
+    <span [ngSwitch]="orderStatus">
+      <p *ngSwitchCase="1">表示已经支付</p>
+      <p *ngSwitchCase="2">已经支付并且确认订单</p>
+      <p *ngSwitchCase="3">表示已经发货</p>
+      <p *ngSwitchCase="4">已经没有货了</p>
+    </span>
+  </div>
+
+  <div class="demo4">
+    <h2>3.[*ngClass] [*ngStyle]</h2>
+    <p [ngClass]="{ red: flag, blue: !flag }">[*ngClass演示]</p>
+    <p [ngStyle]="{ color: red, fontSize: '12px' }">[*ngStyle演示]</p>
+  </div>
+</div>
diff --git a/src/app/pages/home/components/head/head.component.scss b/src/app/pages/home/components/head/head.component.scss
index e69de29..182c31a 100644
--- a/src/app/pages/home/components/head/head.component.scss
+++ b/src/app/pages/home/components/head/head.component.scss
@@ -0,0 +1,11 @@
+.root {
+  .red {
+    color: red;
+  }
+  .blue {
+    color: blue;
+  }
+  .orange {
+    color: orange;
+  }
+}
diff --git a/src/app/pages/home/components/head/head.component.ts b/src/app/pages/home/components/head/head.component.ts
index fc8017e..0fd9c75 100644
--- a/src/app/pages/home/components/head/head.component.ts
+++ b/src/app/pages/home/components/head/head.component.ts
@@ -4,25 +4,25 @@
  * @Author: Ruin 🍭
  * @Date: 2022-03-03 17:07:14
  * @LastEditors: 刘引
- * @LastEditTime: 2022-03-04 10:23:02
+ * @LastEditTime: 2022-03-04 14:10:42
  */
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit } from "@angular/core";
 
 @Component({
-  selector: 'app-head',
-  templateUrl: './head.component.html',
-  styleUrls: ['./head.component.scss'],
+  selector: "app-head",
+  templateUrl: "./head.component.html",
+  styleUrls: ["./head.component.scss"],
 })
 export class HeadComponent implements OnInit {
-  public title = '我是头部组件';
-  public userName: string = '张三';
-  private age: number = 12;
-  protected school: string = 'xx中学';
-
-  public userInfo: object = {
-    userName: '李四',
-    age: 20,
-  };
+  public newsList: Array<any> = [
+    { title: "我是新闻1" },
+    { title: "我是新闻2" },
+    { title: "我是新闻3" },
+  ];
+  public flag: boolean = true;
+  //1表示已经支付 2并且确认订单 3表示已经发货 4表示已经收货
+  public orderStatus: number = 1;
+  public red: string = "blue";
   constructor() {}
 
   ngOnInit(): void {}
diff --git a/src/app/pages/home/home.component.html b/src/app/pages/home/home.component.html
index 89dda1d..9dad7cd 100644
--- a/src/app/pages/home/home.component.html
+++ b/src/app/pages/home/home.component.html
@@ -4,10 +4,24 @@
  * @Author: Ruin 🍭
  * @Date: 2022-03-03 17:06:15
  * @LastEditors: 刘引
- * @LastEditTime: 2022-03-04 10:53:57
+ * @LastEditTime: 2022-03-04 15:53:16
 -->
 <p>home works!</p>
-<app-head></app-head>
-<app-news></app-news>
-<app-list></app-list>
-<app-body></app-body>
+<!-- <app-news></app-news> -->
+<!-- <app-head></app-head> -->
+<!-- <app-news></app-news> -->
+<!-- <app-list></app-list> -->
+<!-- <app-body></app-body> -->
+<div class="root">
+  <div class="container">
+    <div class="w">
+      <h2>双向数据绑定用法(只适用于表单) MVVM</h2>
+      <input type="text" [(ngModel)]="textContent" />
+      <span>{{ textContent }}</span>
+    </div>
+    <div class="changeKey">
+      <button (click)="changeKeyword()">改值</button>
+      <button (click)="getKeyword()">获取值</button>
+    </div>
+  </div>
+</div>
diff --git a/src/app/pages/home/home.component.ts b/src/app/pages/home/home.component.ts
index 73acf06..774b17a 100644
--- a/src/app/pages/home/home.component.ts
+++ b/src/app/pages/home/home.component.ts
@@ -1,15 +1,19 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit } from "@angular/core";
 
 @Component({
-  selector: 'app-home',
-  templateUrl: './home.component.html',
-  styleUrls: ['./home.component.scss']
+  selector: "app-home",
+  templateUrl: "./home.component.html",
+  styleUrls: ["./home.component.scss"],
 })
 export class HomeComponent implements OnInit {
+  public textContent: any;
+  constructor() {}
 
-  constructor() { }
-
-  ngOnInit(): void {
+  ngOnInit(): void {}
+  changeKeyword() {
+    this.textContent = "改变keywords的值";
+  }
+  getKeyword() {
+    console.log(this.textContent);
   }
-
 }
diff --git a/src/app/pages/home/home.module.ts b/src/app/pages/home/home.module.ts
index 7fc4bce..a032a1c 100644
--- a/src/app/pages/home/home.module.ts
+++ b/src/app/pages/home/home.module.ts
@@ -4,17 +4,20 @@
  * @Author: Ruin 🍭
  * @Date: 2022-03-03 17:06:01
  * @LastEditors: 刘引
- * @LastEditTime: 2022-03-04 11:01:41
+ * @LastEditTime: 2022-03-04 15:42:19
  */
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { HomeComponent } from './home.component';
-import { HeadComponent } from './components/head/head.component';
-import { BodyComponent } from './components/body/body.component';
-import { ComponentsModule } from 'src/app/components/components.module';
+import { NgModule } from "@angular/core";
+import { CommonModule } from "@angular/common";
+import { HomeComponent } from "./home.component";
+import { HeadComponent } from "./components/head/head.component";
+import { BodyComponent } from "./components/body/body.component";
+import { ComponentsModule } from "src/app/components/components.module";
+// 引入双向数据绑定
+import { FormsModule } from "@angular/forms";
+
 @NgModule({
   declarations: [HomeComponent, HeadComponent, BodyComponent],
-  imports: [CommonModule, ComponentsModule],
-  // exports: [HomeComponent, HeadComponent, BodyComponent],
+  imports: [CommonModule, ComponentsModule, FormsModule],
+  exports: [HomeComponent, HeadComponent, BodyComponent],
 })
 export class HomeModule {}
diff --git a/src/app/pages/pages.module.ts b/src/app/pages/pages.module.ts
index 89b1b75..bb1bc65 100644
--- a/src/app/pages/pages.module.ts
+++ b/src/app/pages/pages.module.ts
@@ -4,7 +4,7 @@
  * @Author: Ruin 🍭
  * @Date: 2022-03-03 17:03:51
  * @LastEditors: 刘引
- * @LastEditTime: 2022-03-04 11:32:51
+ * @LastEditTime: 2022-03-04 15:46:33
  */
 import { NgModule } from "@angular/core";
 import { CommonModule } from "@angular/common";
@@ -13,6 +13,6 @@ import { UserModule } from "./user/user.module";
 @NgModule({
   declarations: [],
   imports: [CommonModule, HomeModule, UserModule],
-  // exports: [CommonModule, HomeModule, UserModule],
+  exports: [CommonModule, HomeModule, UserModule],
 })
 export class PagesModule {}
diff --git a/src/app/pages/user/user.component.html b/src/app/pages/user/user.component.html
index cf34aed..574ae92 100644
--- a/src/app/pages/user/user.component.html
+++ b/src/app/pages/user/user.component.html
@@ -4,7 +4,7 @@
  * @Author: Ruin 🍭
  * @Date: 2022-03-04 10:45:56
  * @LastEditors: 刘引
- * @LastEditTime: 2022-03-04 10:48:52
+ * @LastEditTime: 2022-03-04 15:36:47
 -->
 <p>user works!</p>
 <app-info></app-info>
diff --git a/src/app/pages/user/user.module.ts b/src/app/pages/user/user.module.ts
index 858e5c7..ee92370 100644
--- a/src/app/pages/user/user.module.ts
+++ b/src/app/pages/user/user.module.ts
@@ -4,17 +4,17 @@
  * @Author: Ruin 🍭
  * @Date: 2022-03-04 10:42:33
  * @LastEditors: 刘引
- * @LastEditTime: 2022-03-04 11:02:36
+ * @LastEditTime: 2022-03-04 15:47:19
  */
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { InfoComponent } from './components/info/info.component';
-import { MineComponent } from './components/mine/mine.component';
-import { UserComponent } from './user.component';
+import { NgModule } from "@angular/core";
+import { CommonModule } from "@angular/common";
+import { InfoComponent } from "./components/info/info.component";
+import { MineComponent } from "./components/mine/mine.component";
+import { UserComponent } from "./user.component";
 
 @NgModule({
   declarations: [InfoComponent, MineComponent, UserComponent],
   imports: [CommonModule],
-  // exports: [InfoComponent, MineComponent, UserComponent],
+  exports: [InfoComponent, MineComponent, UserComponent],
 })
 export class UserModule {}
diff --git a/src/assets/images/home/cat.png b/src/assets/images/home/cat.png
new file mode 100644
index 0000000..0908b5c
Binary files /dev/null and b/src/assets/images/home/cat.png differ
diff --git a/src/index.html b/src/index.html
index 55d73c5..81af708 100644
--- a/src/index.html
+++ b/src/index.html
@@ -1,13 +1,21 @@
-<!doctype html>
+<!--
+ * @Description: {{ByRuin}}
+ * @Version: 2.0
+ * @Author: Ruin 🍭
+ * @Date: 2022-03-03 16:21:23
+ * @LastEditors: 刘引
+ * @LastEditTime: 2022-03-04 12:28:19
+-->
+<!DOCTYPE html>
 <html lang="en">
-<head>
-  <meta charset="utf-8">
-  <title>LearnNg</title>
-  <base href="/">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <link rel="icon" type="image/x-icon" href="favicon.ico">
-</head>
-<body>
-  <app-root></app-root>
-</body>
+  <head>
+    <meta charset="utf-8" />
+    <title>angular-frame</title>
+    <base href="/" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <link rel="icon" type="image/x-icon" href="favicon.ico" />
+  </head>
+  <body>
+    <app-root></app-root>
+  </body>
 </html>