diff --git a/src/store/modules/themeConfig.js b/src/store/modules/themeConfig.js
index d39eac9..bcf6a78 100644
--- a/src/store/modules/themeConfig.js
+++ b/src/store/modules/themeConfig.js
@@ -6,7 +6,7 @@ const themeConfigModule = {
 			isDrawer: false,
 
 			/* 界面设置
-            ------------------------------- */
+      ------------------------------- */
 			// 是否开启菜单水平折叠效果
 			isCollapse: false,
 			// 是否开启菜单手风琴效果
@@ -15,7 +15,7 @@ const themeConfigModule = {
 			isFixedHeader: false,
 
 			/* 界面显示
-            ------------------------------- */
+      ------------------------------- */
 			// 是否开启侧边栏 Logo
 			isShowLogo: false,
 			// 是否开启 Breadcrumb
@@ -35,17 +35,26 @@ const themeConfigModule = {
 			// 是否开启色弱模式
 			isInvert: false,
 
-			/* 布局切换
-            ------------------------------- */
-			// 默认布局，可选值"<defaults|classic|transverse|columns>"，默认 defaults
-			layout: 'defaults',
+			/* 其它设置
+      ------------------------------- */
+			// 默认 Tagsview 风格，可选 1、 tags-style-one，自行扩展：
+			// 1、需修改 @/views/layout/navBars/breadcrumb/setings.vue `getThemeConfig.tagsStyle` el-option
+			// 2、需修改 @/views/layout/navBars/tagsView/tagsView.vue 代码最底部注释部分 css 样式
+			tagsStyle: 'tags-style-one',
+			// 默认主页面切换动画，可选 1、 slide-right 2、 slide-left 3、 opacitys
+			animation: 'slide-right',
 			// 默认分栏高亮风格，可选值"<columns-round|columns-card>"，默认 columns-round
 			columnsAsideStyle: 'columns-round',
 			// 默认分栏布局风格，，可选值"<columns-horizontal|columns-vertical>"，默认 columns-vertical
 			columnsAsideLayout: 'columns-vertical',
 
+			/* 布局切换
+      ------------------------------- */
+			// 默认布局，可选值"<defaults|classic|transverse|columns>"，默认 defaults
+			layout: 'defaults',
+
 			/* 全局网站标题 / 副标题
-            ------------------------------- */
+      ------------------------------- */
 			// 网站主标题（菜单导航、浏览器当前网页标题）
 			globalTitle: 'vue-prev-admin',
 			// 网站副标题（登录页顶部文字）
diff --git a/src/views/layout/component/columnsAside.vue b/src/views/layout/component/columnsAside.vue
index f3ba591..b437c67 100644
--- a/src/views/layout/component/columnsAside.vue
+++ b/src/views/layout/component/columnsAside.vue
@@ -12,7 +12,7 @@
 				>
 					<div :class="setColumnsAsidelayout" v-if="!v.meta.isLink || (v.meta.isLink && v.meta.isIframe)">
 						<i :class="v.meta.icon"></i>
-						<div class="layout-columns-aside-li-box-title font12">
+						<div class="font12">
 							{{
 								$t(v.meta.title) && $t(v.meta.title).length >= 4
 									? $t(v.meta.title).substr(0, setColumnsAsidelayout === 'columns-vertical' ? 4 : 3)
@@ -23,7 +23,7 @@
 					<div :class="setColumnsAsidelayout" v-else>
 						<a :href="v.meta.isLink" target="_blank">
 							<i :class="v.meta.icon"></i>
-							<div class="layout-columns-aside-li-box-title font12">
+							<div class="font12">
 								{{
 									$t(v.meta.title) && $t(v.meta.title).length >= 4
 										? $t(v.meta.title).substr(0, setColumnsAsidelayout === 'columns-vertical' ? 4 : 3)
diff --git a/src/views/layout/navBars/breadcrumb/setings.vue b/src/views/layout/navBars/breadcrumb/setings.vue
index 068ebad..dbad50f 100644
--- a/src/views/layout/navBars/breadcrumb/setings.vue
+++ b/src/views/layout/navBars/breadcrumb/setings.vue
@@ -91,6 +91,45 @@
 					</div>
 				</div>
 
+				<!-- 其它设置 -->
+				<el-divider content-position="left">{{ $t('message.layout.fiveTitle') }}</el-divider>
+				<div class="layout-breadcrumb-seting-bar-flex mt15">
+					<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('message.layout.fiveTagsStyle') }}</div>
+					<div class="layout-breadcrumb-seting-bar-flex-value">
+						<el-select v-model="getThemeConfig.tagsStyle" placeholder="请选择" size="mini" style="width: 90px" @change="setLocalThemeConfig">
+							<el-option label="风格1" value="tags-style-one"></el-option>
+						</el-select>
+					</div>
+				</div>
+				<div class="layout-breadcrumb-seting-bar-flex mt15">
+					<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('message.layout.fiveAnimation') }}</div>
+					<div class="layout-breadcrumb-seting-bar-flex-value">
+						<el-select v-model="getThemeConfig.animation" placeholder="请选择" size="mini" style="width: 90px" @change="setLocalThemeConfig">
+							<el-option label="slide-right" value="slide-right"></el-option>
+							<el-option label="slide-left" value="slide-left"></el-option>
+							<el-option label="opacitys" value="opacitys"></el-option>
+						</el-select>
+					</div>
+				</div>
+				<div class="layout-breadcrumb-seting-bar-flex mt15">
+					<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('message.layout.fiveColumnsAsideStyle') }}</div>
+					<div class="layout-breadcrumb-seting-bar-flex-value">
+						<el-select v-model="getThemeConfig.columnsAsideStyle" placeholder="请选择" size="mini" style="width: 90px" @change="setLocalThemeConfig">
+							<el-option label="圆角" value="columns-round"></el-option>
+							<el-option label="卡片" value="columns-card"></el-option>
+						</el-select>
+					</div>
+				</div>
+				<div class="layout-breadcrumb-seting-bar-flex mt15 mb28">
+					<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('message.layout.fiveColumnsAsideLayout') }}</div>
+					<div class="layout-breadcrumb-seting-bar-flex-value">
+						<el-select v-model="getThemeConfig.columnsAsideLayout" placeholder="请选择" size="mini" style="width: 90px" @change="setLocalThemeConfig">
+							<el-option label="水平" value="columns-horizontal"></el-option>
+							<el-option label="垂直" value="columns-vertical"></el-option>
+						</el-select>
+					</div>
+				</div>
+
 				<!-- 布局切换 -->
 				<el-divider content-position="left">{{ $t('message.layout.sixTitle') }}</el-divider>
 				<div class="layout-drawer-content-flex">
diff --git a/src/views/layout/navBars/tagsView/tagsView.vue b/src/views/layout/navBars/tagsView/tagsView.vue
index 70e62db..a675e7b 100644
--- a/src/views/layout/navBars/tagsView/tagsView.vue
+++ b/src/views/layout/navBars/tagsView/tagsView.vue
@@ -1,7 +1,7 @@
 <template>
 	<div class="layout-navbars-tagsview">
 		<el-scrollbar ref="scrollbarRef" @wheel.native.prevent="onHandleScroll">
-			<ul class="layout-navbars-tagsview-ul" ref="tagsUlRef">
+			<ul class="layout-navbars-tagsview-ul" :class="setTagsStyle" ref="tagsUlRef">
 				<li
 					v-for="(v, k) in tagsViewList"
 					:key="k"
@@ -56,6 +56,10 @@ export default {
 		getThemeConfig() {
 			return this.$store.state.themeConfig.themeConfig;
 		},
+		// 动态设置 tagsView 风格样式
+		setTagsStyle() {
+			return this.$store.state.themeConfig.themeConfig.tagsStyle;
+		},
 	},
 	created() {
 		// 监听非本页面调用 0 刷新当前，1 关闭当前，2 关闭其它，3 关闭全部
@@ -387,5 +391,14 @@ export default {
 	& ::-webkit-scrollbar {
 		display: none !important;
 	}
+	// // 风格2
+	// .tags-style-two {
+	// }
+	// // 风格3
+	// .tags-style-three {
+	// }
+	// // 风格4
+	// .tags-style-four {
+	// }
 }
 </style>
diff --git a/src/views/layout/routerView/parent.vue b/src/views/layout/routerView/parent.vue
index caf1d38..d335335 100644
--- a/src/views/layout/routerView/parent.vue
+++ b/src/views/layout/routerView/parent.vue
@@ -1,6 +1,6 @@
 <template>
 	<div class="h100">
-		<transition name="slide-right" mode="out-in">
+		<transition :name="setTransitionName" mode="out-in">
 			<keep-alive :include="keepAliveNameList">
 				<router-view :key="refreshRouterViewKey" />
 			</keep-alive>
@@ -19,6 +19,7 @@ export default {
 		};
 	},
 	created() {
+		// 页面加载前，处理缓存，页面刷新时路由缓存处理
 		this.keepAliveNameList = this.getKeepAliveNames();
 		this.bus.$on('onTagsViewRefreshRouterView', (path) => {
 			if (this.$route.path !== path) return false;
@@ -30,6 +31,12 @@ export default {
 			});
 		});
 	},
+	computed: {
+		// 设置主界面切换动画
+		setTransitionName() {
+			return this.$store.state.themeConfig.themeConfig.animation;
+		},
+	},
 	methods: {
 		// 获取路由缓存列表（name），默认路由全部缓存
 		getKeepAliveNames() {