diff --git a/templates/layouts/base.html b/templates/layouts/base.html
index df46d27..89c430d 100644
--- a/templates/layouts/base.html
+++ b/templates/layouts/base.html
@@ -58,7 +58,7 @@
                     <!-- Avatar Dropdown (click to toggle) -->
                     <div class="relative" id="avatarDropdown">
                         <button type="button" id="avatarBtn" class="flex items-center gap-2 hover:opacity-80 transition-opacity cursor-pointer" onclick="toggleDropdown()">
-                            <div class="w-8 h-8 rounded-full overflow-hidden border-2 border-gray-300 hover:border-blue-500 transition-colors flex items-center justify-center bg-gray-200 text-gray-600 font-bold text-sm">
+                            <div id="headerAvatarWrap" class="w-8 h-8 rounded-full overflow-hidden border-2 border-gray-300 hover:border-blue-500 transition-colors flex items-center justify-center bg-gray-200 text-gray-600 font-bold text-sm">
                                 {{if .Avatar}}
                                     <img src="/uploads/avatars/{{.Avatar}}" alt="avatar" class="w-full h-full object-cover">
                                 {{else}}
diff --git a/templates/pages/profile.html b/templates/pages/profile.html
index 661481f..562cac8 100644
--- a/templates/pages/profile.html
+++ b/templates/pages/profile.html
@@ -212,10 +212,11 @@
                     previewContainer.innerHTML =
                         '<img src="' + avatarUrl + '" alt="avatar" class="w-full h-full object-cover">';
 
-                    // Update nav bar avatar
-                    var navAvatarBtn = document.getElementById('avatarBtn');
-                    if (navAvatarBtn) {
-                        navAvatarBtn.innerHTML =
+                    // Update nav bar avatar：只替换头像圆形容器内的内容，
+                    // 保留按钮结构与用户名文本，避免样式被破坏。
+                    var navAvatarWrap = document.getElementById('headerAvatarWrap');
+                    if (navAvatarWrap) {
+                        navAvatarWrap.innerHTML =
                             '<img src="' + avatarUrl + '" alt="avatar" class="w-full h-full object-cover">';
                     }