diff --git a/docs/button-visibility.md b/docs/button-visibility.md
new file mode 100644
index 0000000..62204aa
--- /dev/null
+++ b/docs/button-visibility.md
@@ -0,0 +1,38 @@
+# 关于隐藏行和列操作按钮的说明
+
+## 背景
+
+在当前版本中，行和列操作按钮（插入、删除等）暂时被隐藏，原因如下：
+
+1. **用户体验**：目前这些按钮的使用体验有待提高，可能会对用户操作造成干扰。
+2. **功能优化**：我们计划对这些按钮的交互和视觉效果进行优化，以更好地满足用户需求。
+
+## 修改内容
+
+在 `styles.css` 文件中，以下样式被添加以隐藏这些按钮：
+
+```css
+.csv-insert-row-btn,
+.csv-insert-col-btn,
+.csv-del-row-btn,
+.csv-del-col-btn {
+  display: none !important;
+}
+```
+
+## 后续计划
+
+我们将根据用户反馈和实际需求，对这些按钮进行以下改进：
+
+- 提升按钮的视觉效果，使其更加直观。
+- 优化按钮的交互逻辑，减少误操作。
+- 提供更灵活的配置选项，允许用户根据需要启用或禁用这些按钮。
+
+## 反馈
+
+如果您对这一改动有任何意见或建议，请通过以下方式联系我们：
+
+- GitHub Issue
+- 用户反馈表单
+
+感谢您的支持与理解！
diff --git a/src/view/table-render.ts b/src/view/table-render.ts
index 3c024a2..59d1506 100644
--- a/src/view/table-render.ts
+++ b/src/view/table-render.ts
@@ -289,6 +289,20 @@ export function renderTable(options: TableRenderOptions) {
   }
 
   // 滚动条容器宽度同步逻辑建议由主类处理
+
+  // Add event listener to deselect active row or column when clicking outside
+  const deselectActiveHeader = () => {
+    const activeHeaders = tableEl.querySelectorAll('.csv-col-number.active, .csv-row-number.active');
+    activeHeaders.forEach(header => header.classList.remove('active'));
+  };
+
+  document.addEventListener('click', (e) => {
+    const target = e.target as HTMLElement | null;
+    const isHeaderClick = target?.closest('.csv-col-number, .csv-row-number');
+    if (!isHeaderClick) {
+      deselectActiveHeader();
+    }
+  });
 }
 
 // 建议在 styles.css 添加 .dragging 和 .drag-over 的样式以增强拖拽反馈
diff --git a/styles.css b/styles.css
index aeb6eb0..46579f5 100644
--- a/styles.css
+++ b/styles.css
@@ -484,6 +484,14 @@ td input:focus {
   border-radius: 4px;
 }
 
+/* 暂时隐藏行和列操作按钮 */
+.csv-insert-row-btn,
+.csv-insert-col-btn,
+.csv-del-row-btn,
+.csv-del-col-btn {
+  display: none !important;
+}
+
 /* 插入/删除行列按钮样式 */
 .csv-insert-row-btn,
 .csv-insert-col-btn,