diff --git a/src/SubMenu/index.tsx b/src/SubMenu/index.tsx
index e95e96dd..9b0c9be7 100644
--- a/src/SubMenu/index.tsx
+++ b/src/SubMenu/index.tsx
@@ -22,7 +22,7 @@ import {
 import { useMenuId } from '../context/IdContext';
 import PrivateContext from '../context/PrivateContext';
 
-export type SemanticName = 'list' | 'listTitle';
+export type SemanticName = 'list' | 'listTitle' | 'subItem' | 'subItemTitle';
 export interface SubMenuProps extends Omit<SubMenuType, 'key' | 'children' | 'label' | 'title'> {
   classNames?: Partial<Record<SemanticName, string>>;
   styles?: Partial<Record<SemanticName, React.CSSProperties>>;
@@ -250,8 +250,8 @@ const InternalSubMenu = React.forwardRef<HTMLLIElement, SubMenuProps>((props, re
   let titleNode: React.ReactElement = (
     <div
       role="menuitem"
-      style={directionStyle}
-      className={`${subMenuPrefixCls}-title`}
+      style={{ ...directionStyle, ...styles?.subItemTitle }}
+      className={clsx(`${subMenuPrefixCls}-title`, menuClassNames?.subItemTitle)}
       tabIndex={mergedDisabled ? null : -1}
       ref={elementRef}
       title={itemTitle ?? (typeof title === 'string' ? title : null)}
@@ -339,13 +339,19 @@ const InternalSubMenu = React.forwardRef<HTMLLIElement, SubMenuProps>((props, re
       role="none"
       {...restProps}
       component="li"
-      style={style}
-      className={clsx(subMenuPrefixCls, `${subMenuPrefixCls}-${mode}`, className, {
-        [`${subMenuPrefixCls}-open`]: open,
-        [`${subMenuPrefixCls}-active`]: mergedActive,
-        [`${subMenuPrefixCls}-selected`]: childrenSelected,
-        [`${subMenuPrefixCls}-disabled`]: mergedDisabled,
-      })}
+      style={{ ...styles?.subItem, ...style }}
+      className={clsx(
+        subMenuPrefixCls,
+        `${subMenuPrefixCls}-${mode}`,
+        menuClassNames?.subItem,
+        className,
+        {
+          [`${subMenuPrefixCls}-open`]: open,
+          [`${subMenuPrefixCls}-active`]: mergedActive,
+          [`${subMenuPrefixCls}-selected`]: childrenSelected,
+          [`${subMenuPrefixCls}-disabled`]: mergedDisabled,
+        },
+      )}
       onMouseEnter={onInternalMouseEnter}
       onMouseLeave={onInternalMouseLeave}
     >
diff --git a/tests/semantic.spec.tsx b/tests/semantic.spec.tsx
index 360c4639..3cf86e4a 100644
--- a/tests/semantic.spec.tsx
+++ b/tests/semantic.spec.tsx
@@ -47,6 +47,39 @@ describe('semantic', () => {
     expect(listTitle).toHaveClass(testClassNames.listTitle);
     expect(listTitle).toHaveStyle(testStyles.listTitle);
   });
+  it('support classNames and styles for SubMenu self node (subItem / subItemTitle)', () => {
+    const testClassNames = {
+      subItem: 'test-sub-item',
+      subItemTitle: 'test-sub-item-title',
+    };
+    const testStyles = {
+      subItem: { width: '200px' },
+      subItemTitle: { whiteSpace: 'normal' },
+    };
+    const { container } = render(
+      <Menu mode="inline" openKeys={['s1', 's1-2']}>
+        <SubMenu key="s1" title="submenu1" classNames={testClassNames} styles={testStyles}>
+          <SubMenu key="s1-2" title="submenu1-1" classNames={testClassNames} styles={testStyles}>
+            <MenuItem key="s1-2-1">2-1</MenuItem>
+          </SubMenu>
+        </SubMenu>
+      </Menu>,
+    );
+
+    const subItem = container.querySelector('.rc-menu-submenu');
+    const subItemTitle = container.querySelector('.rc-menu-submenu-title');
+    expect(subItem).toHaveClass(testClassNames.subItem);
+    expect(subItem).toHaveStyle(testStyles.subItem);
+    expect(subItemTitle).toHaveClass(testClassNames.subItemTitle);
+    expect(subItemTitle).toHaveStyle(testStyles.subItemTitle);
+
+    const nestedSubItem = container.querySelector('.rc-menu-submenu .rc-menu-submenu');
+    const nestedSubItemTitle = nestedSubItem.querySelector('.rc-menu-submenu-title');
+    expect(nestedSubItem).toHaveClass(testClassNames.subItem);
+    expect(nestedSubItem).toHaveStyle(testStyles.subItem);
+    expect(nestedSubItemTitle).toHaveClass(testClassNames.subItemTitle);
+    expect(nestedSubItemTitle).toHaveStyle(testStyles.subItemTitle);
+  });
   it('support classNames and styles for Menu', () => {
     const testClassNames = {
       list: 'test-list',