diff --git a/pages.json b/pages.json
index 99b473a8bbc9362594c2d7035b30f1c4c7e9a432..f77f03812932e89787dfb73b283b7dac7cebd509 100644
--- a/pages.json
+++ b/pages.json
@@ -401,7 +401,13 @@
       "style": {
         "navigationBarTitleText": "width"
       }
-    },
+    },
+	{
+	  "path": "pages/CSS/layout/visibility",
+	  "style": {
+	    "navigationBarTitleText": "visibility"
+	  }
+	},
     {
       "path": "pages/CSS/margin/margin-bottom",
       "style": {
@@ -503,7 +509,13 @@
       "style": {
         "navigationBarTitleText": "text-align"
       }
-    },
+    },
+	{
+	  "path": "pages/CSS/text/text-overflow",
+	  "style": {
+	    "navigationBarTitleText": "text-overflow"
+	  }
+	},
     {
       "path": "pages/CSS/text/text-decoration-line",
       "style": {
diff --git a/pages/CSS/layout/visibility.uvue b/pages/CSS/layout/visibility.uvue
new file mode 100644
index 0000000000000000000000000000000000000000..7940abda12a52d81bc27e5a21ba09a4b589815e1
--- /dev/null
+++ b/pages/CSS/layout/visibility.uvue
@@ -0,0 +1,37 @@
+<template>
+	<view style="flex-grow: 1;">
+		<view @click="changeVisibility">
+			<text>visibility: {{visibility}}（点击切换）</text>
+			<view class="common" :style="{'visibility': visibility}"></view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				visibility: 'visible',
+				flag: true
+			}
+		},
+		methods: {
+			changeVisibility() {
+				this.flag = !this.flag;
+				if (this.flag) {
+					this.visibility = 'visible';
+				} else {
+					this.visibility = 'hidden';
+				}
+			}
+		}
+	}
+</script>
+
+<style>
+	.common {
+		width: 500rpx;
+		height: 500rpx;
+		background-color: red;
+	}
+</style>
\ No newline at end of file
diff --git a/pages/CSS/text/text-overflow.uvue b/pages/CSS/text/text-overflow.uvue
new file mode 100644
index 0000000000000000000000000000000000000000..d944a8877620c0701b2add4581c5a0ef1d4b34c1
--- /dev/null
+++ b/pages/CSS/text/text-overflow.uvue
@@ -0,0 +1,26 @@
+<template>
+	<view style="flex-grow: 1;">
+		<view style="height: 500rpx;background-color: gray;justify-content: center;align-items: center;">
+			<text class="common" style="text-overflow: clip;">{{text}}</text>
+			<text class="common" style="text-overflow: ellipsis;">{{text}}</text>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				text: 'HBuilderX，轻巧、极速，极客编辑器；uni-app x，终极跨平台方案；uts，大一统语言'
+			}
+		}
+	}
+</script>
+
+<style>
+	.common {
+		width: 500rpx;
+		height: 60rpx;
+		font-size: 20px;
+	}
+</style>
\ No newline at end of file
diff --git a/pages/tabBar/CSS.uvue b/pages/tabBar/CSS.uvue
index ded37822c938a1cbff26a76d1b6331245742c6dc..543ee7f8e982adedf1c2e826d380d7ad51abbbae 100644
--- a/pages/tabBar/CSS.uvue
+++ b/pages/tabBar/CSS.uvue
@@ -167,6 +167,10 @@
 						{
 							name: 'width',
 							url: '/pages/CSS/layout/width'
+						},
+						{
+							name: 'visibility',
+							url: '/pages/CSS/layout/visibility'
 						}
 					] as Page[]
 				}, {
@@ -252,6 +256,10 @@
 							name: 'text-align',
 							url: '/pages/CSS/text/text-align'
 						},
+						{
+							name: 'text-overflow',
+							url: '/pages/CSS/text/text-overflow'
+						},
 						{
 							name: 'text-decoration-line',
 							url: '/pages/CSS/text/text-decoration-line'