update frontend and security

Tonyzhai.md

@@ -17,4 +17,3 @@ git push -u origin main
 
 HUGO version: 
 
-git push https://[email protected]/wzhai-hub/Tony

content/Backend/Security/IPsec.md → content/Backend/Security/IPsec/index.md

@@ -1,3 +1,34 @@
+---
+# Documentation: https://hugoblox.com/docs/managing-content/
+
+title: "Internet Protocol Security"
+subtitle: ""
+summary: "互联网协议安全,是一组协议和标准，用于在互联网通信中提供网络层的安全性。其主要目标是保护 IP 数据包的机密性、完整性和身份认证"
+authors: []
+# tags:
+#   - Istio
+categories: []
+date: 2024-03-08T11:27:22+08:00
+lastmod: 2024-03-15T11:27:22+08:00
+featured: false
+draft: false
+
+# Featured image
+# To use, add an image named `featured.jpg/png` to your page's folder.
+# Focal points: Smart, Center, TopLeft, Top, TopRight, Left, Right, BottomLeft, Bottom, BottomRight.
+image:
+  caption: ""
+  focal_point: ""
+  preview_only: false
+
+# Projects (optional).
+#   Associate this post with one or more of your projects.
+#   Simply enter your project's folder or file name without extension.
+#   E.g. `projects = ["internal-project"]` references `content/project/deep-learning/index.md`.
+#   Otherwise, set `projects = []`.
+projects: []
+---
+
 IPsec，全称为Internet Protocol Security（互联网协议安全），是一组协议和标准，用于在互联网通信中提供网络层的安全性。其主要目标是保护 IP 数据包的机密性、完整性和身份认证。IPsec 可以在网络层对通信进行加密和认证，通常用于构建虚拟私有网络（VPN）和其他安全通信渠道。
 
 IPsec 的主要特性包括：

content/Backend/Security/OAuth.md → content/Backend/Security/OAuth/index.md

@@ -1,3 +1,34 @@
+---
+# Documentation: https://hugoblox.com/docs/managing-content/
+
+title: "OAuth"
+subtitle: ""
+summary: "OAuth 2.0认证是一个开放标准，它允许用户授权第三方应用访问他们存储在另外的服务提供者上的信息，而不需要将用户名和密码提供给第三方应用或分享他们数据的所有内容"
+authors: []
+# tags:
+#   - Istio
+categories: []
+date: 2024-03-08T11:27:22+08:00
+lastmod: 2024-03-15T11:27:22+08:00
+featured: false
+draft: false
+
+# Featured image
+# To use, add an image named `featured.jpg/png` to your page's folder.
+# Focal points: Smart, Center, TopLeft, Top, TopRight, Left, Right, BottomLeft, Bottom, BottomRight.
+image:
+  caption: ""
+  focal_point: ""
+  preview_only: false
+
+# Projects (optional).
+#   Associate this post with one or more of your projects.
+#   Simply enter your project's folder or file name without extension.
+#   E.g. `projects = ["internal-project"]` references `content/project/deep-learning/index.md`.
+#   Otherwise, set `projects = []`.
+projects: []
+---
+
 OAuth 2.0 和 OIDC 工作流程
 
 OAuth 2.0 工作流程

content/Backend/Security/OIDC.md → content/Backend/Security/OIDC/index.md

@@ -1,3 +1,34 @@
+---
+# Documentation: https://hugoblox.com/docs/managing-content/
+
+title: "OpenID Connect"
+subtitle: ""
+summary: "基于OAuth 2.0的身份认证授权协议.它结合了OAuth 2.0的授权功能和OpenID的认证功能，为客户端应用提供了一种安全、标准的方式来验证用户的身份并获取用户的基本信息。"
+authors: []
+# tags:
+#   - Istio
+categories: []
+date: 2024-03-08T11:27:22+08:00
+lastmod: 2024-03-15T11:27:22+08:00
+featured: false
+draft: false
+
+# Featured image
+# To use, add an image named `featured.jpg/png` to your page's folder.
+# Focal points: Smart, Center, TopLeft, Top, TopRight, Left, Right, BottomLeft, Bottom, BottomRight.
+image:
+  caption: ""
+  focal_point: ""
+  preview_only: false
+
+# Projects (optional).
+#   Associate this post with one or more of your projects.
+#   Simply enter your project's folder or file name without extension.
+#   E.g. `projects = ["internal-project"]` references `content/project/deep-learning/index.md`.
+#   Otherwise, set `projects = []`.
+projects: []
+---
+
 OIDC（OpenID Connect）是一个基于OAuth 2.0的身份认证授权协议。它结合了OAuth 2.0的授权功能和OpenID的认证功能，为客户端应用提供了一种安全、标准的方式来验证用户的身份并获取用户的基本信息。
 
 OIDC规定了一套将用户身份信息从授权服务器（身份提供方）传递给客户机应用（身份使用方）的标准流程、格式。这使得客户端应用可以基于用户在授权服务器上进行的身份验证来验证其身份，并获取用户的基本资料，如姓名、邮箱等。

content/Backend/Security/tunnel.md → content/Backend/Security/tunnel/index.md

@@ -1,3 +1,34 @@
+---
+# Documentation: https://hugoblox.com/docs/managing-content/
+
+title: "Tunneling Protocol"
+subtitle: ""
+summary: "隧道协议,它允许在一个网络协议的封装下传输另一个网络协议的数据。隧道协议的主要目的是在不同网络之间创建一条逻辑上的连接，使得数据可以在这条连接上进行安全、可靠的传输"
+authors: []
+# tags:
+#   - Istio
+categories: []
+date: 2024-03-08T11:27:22+08:00
+lastmod: 2024-03-15T11:27:22+08:00
+featured: false
+draft: false
+
+# Featured image
+# To use, add an image named `featured.jpg/png` to your page's folder.
+# Focal points: Smart, Center, TopLeft, Top, TopRight, Left, Right, BottomLeft, Bottom, BottomRight.
+image:
+  caption: ""
+  focal_point: ""
+  preview_only: false
+
+# Projects (optional).
+#   Associate this post with one or more of your projects.
+#   Simply enter your project's folder or file name without extension.
+#   E.g. `projects = ["internal-project"]` references `content/project/deep-learning/index.md`.
+#   Otherwise, set `projects = []`.
+projects: []
+---
+
 "隧道协议" 是一种网络通信的技术，它允许在一个网络协议的封装下传输另一个网络协议的数据。隧道协议的主要目的是在不同网络之间创建一条逻辑上的连接，使得数据可以在这条连接上进行安全、可靠的传输。
 
 常见的隧道协议有以下几种：

content/Frontend/CSS/CSS-Selector.md

@@ -1,3 +1,36 @@
+---
+# Documentation: https://hugoblox.com/docs/managing-content/
+
+title: "CSS-selector"
+subtitle: ""
+summary: "CSS选择器"
+
+authors: []
+# tags: []
+# tags:
+#   - CSS
+categories: []
+date: 2024-03-08T11:27:22+08:00
+lastmod: 2024-03-08T11:27:22+08:00
+featured: false
+draft: false
+
+# Featured image
+# To use, add an image named `featured.jpg/png` to your page's folder.
+# Focal points: Smart, Center, TopLeft, Top, TopRight, Left, Right, BottomLeft, Bottom, BottomRight.
+image:
+  caption: ""
+  focal_point: ""
+  preview_only: false
+
+# Projects (optional).
+#   Associate this post with one or more of your projects.
+#   Simply enter your project's folder or file name without extension.
+#   E.g. `projects = ["internal-project"]` references `content/project/deep-learning/index.md`.
+#   Otherwise, set `projects = []`.
+projects: []
+---
+
 CSS（层叠样式表）选择器用于选择 HTML 或 XML 文档中的元素，并为其应用样式。以下是一些常见的 CSS 选择器：
 
 1. **元素选择器（Element Selector）：**

content/Frontend/CSS/CSS-Transition.md

@@ -1,3 +1,36 @@
+---
+# Documentation: https://hugoblox.com/docs/managing-content/
+
+title: "CSS-Transition"
+subtitle: ""
+summary: "CSS 过度"
+
+authors: []
+# tags: []
+# tags:
+#   - CSS
+categories: []
+date: 2024-03-08T11:27:22+08:00
+lastmod: 2024-03-08T11:27:22+08:00
+featured: false
+draft: false
+
+# Featured image
+# To use, add an image named `featured.jpg/png` to your page's folder.
+# Focal points: Smart, Center, TopLeft, Top, TopRight, Left, Right, BottomLeft, Bottom, BottomRight.
+image:
+  caption: ""
+  focal_point: ""
+  preview_only: false
+
+# Projects (optional).
+#   Associate this post with one or more of your projects.
+#   Simply enter your project's folder or file name without extension.
+#   E.g. `projects = ["internal-project"]` references `content/project/deep-learning/index.md`.
+#   Otherwise, set `projects = []`.
+projects: []
+---
+
 在CSS中，过渡（Transition）是一种通过在状态变化时平滑地改变属性值的效果。过渡可以让元素的样式在变化时产生平滑的动画效果，而不是突变。过渡通常用于鼠标悬停、点击或其他状态变化的交互效果。
 
 要使用过渡，你需要定义以下几个关键属性：

content/Frontend/CSS/CSS-border.md

@@ -1,3 +1,36 @@
+---
+# Documentation: https://hugoblox.com/docs/managing-content/
+
+title: "CSS-border"
+subtitle: ""
+summary: "CSS元素边框"
+
+authors: []
+# tags: []
+# tags:
+#   - CSS
+categories: []
+date: 2024-03-08T11:27:22+08:00
+lastmod: 2024-03-08T11:27:22+08:00
+featured: false
+draft: false
+
+# Featured image
+# To use, add an image named `featured.jpg/png` to your page's folder.
+# Focal points: Smart, Center, TopLeft, Top, TopRight, Left, Right, BottomLeft, Bottom, BottomRight.
+image:
+  caption: ""
+  focal_point: ""
+  preview_only: false
+
+# Projects (optional).
+#   Associate this post with one or more of your projects.
+#   Simply enter your project's folder or file name without extension.
+#   E.g. `projects = ["internal-project"]` references `content/project/deep-learning/index.md`.
+#   Otherwise, set `projects = []`.
+projects: []
+---
+
 在CSS中，`border` 是用来定义元素边框的属性。元素的边框是围绕元素内容的线条，可以设置边框的样式、宽度和颜色。
 
 `border` 属性包含了多个子属性，常见的有：

content/Frontend/CSS/CSS-feature.md

@@ -1,3 +1,36 @@
+---
+# Documentation: https://hugoblox.com/docs/managing-content/
+
+title: "CSS features"
+subtitle: ""
+summary: "CSS中，属性选择器"
+
+authors: []
+# tags: []
+# tags:
+#   - CSS
+categories: []
+date: 2024-03-08T11:27:22+08:00
+lastmod: 2024-03-08T11:27:22+08:00
+featured: false
+draft: false
+
+# Featured image
+# To use, add an image named `featured.jpg/png` to your page's folder.
+# Focal points: Smart, Center, TopLeft, Top, TopRight, Left, Right, BottomLeft, Bottom, BottomRight.
+image:
+  caption: ""
+  focal_point: ""
+  preview_only: false
+
+# Projects (optional).
+#   Associate this post with one or more of your projects.
+#   Simply enter your project's folder or file name without extension.
+#   E.g. `projects = ["internal-project"]` references `content/project/deep-learning/index.md`.
+#   Otherwise, set `projects = []`.
+projects: []
+---
+
 CSS（层叠样式表）是用于描述文档展示方式的样式语言。以下是CSS中一些常用的功能：
 
 1. **选择器（Selectors）**: 选择器用于选择要应用样式的HTML元素。例如，`div` 选择所有 `<div>` 元素。

content/Frontend/CSS/CSS-function.md

@@ -1,3 +1,36 @@
+---
+# Documentation: https://hugoblox.com/docs/managing-content/
+
+title: "CSS中 functions"
+subtitle: ""
+summary: "CSS 函数"
+
+authors: []
+# tags: []
+# tags:
+#   - CSS
+categories: []
+date: 2024-03-08T11:27:22+08:00
+lastmod: 2024-03-08T11:27:22+08:00
+featured: false
+draft: false
+
+# Featured image
+# To use, add an image named `featured.jpg/png` to your page's folder.
+# Focal points: Smart, Center, TopLeft, Top, TopRight, Left, Right, BottomLeft, Bottom, BottomRight.
+image:
+  caption: ""
+  focal_point: ""
+  preview_only: false
+
+# Projects (optional).
+#   Associate this post with one or more of your projects.
+#   Simply enter your project's folder or file name without extension.
+#   E.g. `projects = ["internal-project"]` references `content/project/deep-learning/index.md`.
+#   Otherwise, set `projects = []`.
+projects: []
+---
+
 CSS 中的函数主要用于进行各种计算、处理或转换，以便在样式表中使用。以下是一些常见的 CSS 函数：
 
 1. **rgb() 和 rgba()：**

content/Frontend/CSS/CSS-value.md

@@ -1,3 +1,36 @@
+---
+# Documentation: https://hugoblox.com/docs/managing-content/
+
+title: "CSS-value"
+subtitle: ""
+summary: "CSS单位与值"
+
+authors: []
+# tags: []
+# tags:
+#   - CSS
+categories: []
+date: 2024-03-08T11:27:22+08:00
+lastmod: 2024-03-08T11:27:22+08:00
+featured: false
+draft: false
+
+# Featured image
+# To use, add an image named `featured.jpg/png` to your page's folder.
+# Focal points: Smart, Center, TopLeft, Top, TopRight, Left, Right, BottomLeft, Bottom, BottomRight.
+image:
+  caption: ""
+  focal_point: ""
+  preview_only: false
+
+# Projects (optional).
+#   Associate this post with one or more of your projects.
+#   Simply enter your project's folder or file name without extension.
+#   E.g. `projects = ["internal-project"]` references `content/project/deep-learning/index.md`.
+#   Otherwise, set `projects = []`.
+projects: []
+---
+
 在CSS中，属性的值通常由数字、关键字、百分比、长度单位、颜色值等组成。以下是一些常见的值和单位：
 
 ### 1. 数字：