diff --git a/src/app/src/components/messageTypes/Base.tsx b/src/app/src/components/messageTypes/Base.tsx
index 481aef764..6218ad26f 100644
--- a/src/app/src/components/messageTypes/Base.tsx
+++ b/src/app/src/components/messageTypes/Base.tsx
@@ -32,6 +32,14 @@ const MsgBubble = styled.View<{
   align-self: ${(props) => (props.me ? 'flex-end' : 'flex-start')};
 `;
 
+const MsgSenderNameText = styled.Text<{
+  me: boolean;
+}>`
+  margin: 4px 0;
+  font-size: 12px;
+  text-align: ${(props) => (props.me ? 'right' : 'left')};
+`;
+
 const MsgTypeIcon = styled(TIcon)`
   margin: 0 4px;
   align-self: center;
@@ -208,11 +216,9 @@ class Base<P extends MessageProps = MessageProps> extends React.PureComponent<
           )}
 
           <View style={styles.itemBody}>
-            <Text
-              style={[...styles.itemName, me ? { textAlign: 'right' } : null]}
-            >
+            <MsgSenderNameText me={me}>
               {this.getSenderName()}
-            </Text>
+            </MsgSenderNameText>
             <MsgContainer me={me}>
               {/* 不同消息类型的显示 */}
               {_has(this.msgBubbleType, type)
@@ -237,7 +243,6 @@ const styles = {
   ],
   itemView: [sb.direction(), sb.padding(10, 10)],
   itemBody: [sb.padding(0, 4), sb.margin(0, 6), sb.flex()],
-  itemName: [{ marginBottom: 4, marginTop: 4 }, sb.font(12)],
 };
 
 export default Base;
diff --git a/src/app/src/screens/AccountScreen.tsx b/src/app/src/screens/AccountScreen.tsx
index 35afcd484..4c006270c 100644
--- a/src/app/src/screens/AccountScreen.tsx
+++ b/src/app/src/screens/AccountScreen.tsx
@@ -19,6 +19,10 @@ import { showToast } from '@src/shared/redux/actions/ui';
 import { TRPGState } from '@redux/types/__all__';
 const Item = List.Item;
 
+const AccountUserNameText = styled.Text`
+  font-size: 18px;
+`;
+
 const AccountList = styled(List)`
   margin-top: 10px;
 `;
@@ -73,7 +77,7 @@ class AccountScreen extends React.Component<Props> {
             width={60}
           />
           <View style={{ flex: 1 }}>
-            <Text style={styles.username}>{name}</Text>
+            <AccountUserNameText>{name}</AccountUserNameText>
             <Text style={styles.userdesc} numberOfLines={1}>
               {userInfo.sign}
             </Text>
@@ -172,7 +176,6 @@ const styles = {
     sb.alignCenter(),
     { height: 80 },
   ],
-  username: [sb.font(18)],
   userdesc: [sb.color('#999')],
   arrow: [
     { fontFamily: 'iconfont', marginRight: 6 },