diff --git a/devui/fullscreen/index.ts b/devui/fullscreen/index.ts
index 1cc6c868a5fbb83c25948d1d46f5491a5ed6babe..6318965ea8bb7fa908c05b79a61c18287c93a854 100644
--- a/devui/fullscreen/index.ts
+++ b/devui/fullscreen/index.ts
@@ -10,7 +10,7 @@ export { Fullscreen }
 export default {
   title: 'Fullscreen 全屏',
   category: '通用',
-  status: undefined, // TODO: 组件若开发完成则填入"已完成"，并删除该注释
+  status: '已完成',
   install(app: App): void {
     
     app.use(Fullscreen as any)
diff --git a/devui/fullscreen/src/fullscreen.scss b/devui/fullscreen/src/fullscreen.scss
index c0f01d4ebdad1f5899a3c517419f5cfa368d8ca7..38689d367ee1c53be852d47acee4dbbbfec05bf9 100644
--- a/devui/fullscreen/src/fullscreen.scss
+++ b/devui/fullscreen/src/fullscreen.scss
@@ -14,3 +14,7 @@
 .devui-fullscreen {
   overflow: hidden;
 }
+
+:not(:root):fullscreen::backdrop {
+  background: #ffffff;
+}
diff --git a/devui/fullscreen/src/fullscreen.tsx b/devui/fullscreen/src/fullscreen.tsx
index 6f89226a6eb03c1974d4d0a7a21c8f15c5516ae5..d71c606c019f6083d9777119dc4babde2ded25d9 100644
--- a/devui/fullscreen/src/fullscreen.tsx
+++ b/devui/fullscreen/src/fullscreen.tsx
@@ -5,7 +5,6 @@ import {
   useSlots,
   renderSlot,
   onMounted,
-  onUnmounted,
   ref
 } from 'vue'
 import { fullscreenProps, FullscreenProps } from './fullscreen-types'
@@ -18,6 +17,7 @@ export default defineComponent({
 
     let currentTarget = ref(null)
     const isFullscreen = ref(false)
+    const slotElement = ref(null)
     const doc = document
     
     const onFullScreenChange = () => {
@@ -44,6 +44,8 @@ export default defineComponent({
         targetElement.setAttribute('style', `z-index: ${props.zIndex}`)
       }
     }
+
+    // 退出正常全屏
     const exitNormalFullscreen = (targetElement: HTMLElement) => {
       targetElement.classList.remove('fullscreen')
       targetElement.style.zIndex = null
@@ -51,7 +53,8 @@ export default defineComponent({
     
     // 事件监听
     const handleFullscreen = async () => {
-      const targetElement = document.querySelector('[fullscreen-target]')
+      // const targetElement = document.querySelector('[fullscreen-target]')
+      const targetElement = slotElement.value.querySelector('[fullscreen-target]')
       let isFull = false
       // 判断模式
       if (props.mode === 'normal') { // 浏览器全屏
@@ -70,16 +73,15 @@ export default defineComponent({
         if (document.fullscreenElement || document.msFullscreenElement || document.webkitFullscreenElement) {
           isFull = await exitImmersiveFullScreen(document)
         } else {
-          isFull = await launchImmersiveFullScreen(document.documentElement)
+          isFull = await launchImmersiveFullScreen(currentTarget)
         }
       }
-
       isFullscreen.value = isFull
       ctx.emit('fullscreenLaunch', isFullscreen.value)
     }
 
     const addFullScreenStyle = (): void => {
-      document.getElementsByTagName('html')[0].classList.add('devui-fullscreen');
+      document.getElementsByTagName('html')[0].classList.add('devui-fullscreen')
     }
 
     const removeFullScreenStyle = (): void => {
@@ -115,47 +117,34 @@ export default defineComponent({
     }
 
     const handleKeyDown = (event) => {
-      if (event.keyCode === 'ESC_KEYCODE') { // 按ESC键退出全屏
+      if (event.keyCode === 27) { // 按ESC键退出全屏
         if (isFullscreen.value) {
-          const targetElement = document.querySelector('[fullscreen-target]')
+          const targetElement = slotElement.value.querySelector('[fullscreen-target]')
           if (props.mode === 'normal') {
             removeFullScreenStyle()
             exitNormalFullscreen(targetElement)
           } else {
             if (doc.fullscreenElement) { exitImmersiveFullScreen(doc) }
           }
-          ctx.emit('fullscreenLaunch', isFullscreen.value)
           isFullscreen.value = false
+          ctx.emit('fullscreenLaunch', isFullscreen.value)
         }
       }
     }
     
     onMounted (() => {
-      const btnLaunch = document.querySelector('[fullscreen-launch]')
+      const btnLaunch = slotElement.value.querySelector('[fullscreen-launch]')
       if (btnLaunch) { btnLaunch.addEventListener('click', handleFullscreen) }
       document.addEventListener('fullscreenchange', onFullScreenChange)
       document.addEventListener('MSFullscreenChange', onFullScreenChange)
       document.addEventListener('webkitfullscreenchange', onFullScreenChange)
       document.addEventListener('keydown', handleKeyDown)
     })
-    onUnmounted (() => {
-      document.removeEventListener('fullscreenchange', onFullScreenChange)
-      document.removeEventListener('MSFullscreenChange', onFullScreenChange)
-      document.removeEventListener('webkitfullscreenchange', onFullScreenChange)
-      document.removeEventListener('keydown', handleKeyDown)
-      const btnLaunch = document.querySelector('[fullscreen-launch]')
-      if (btnLaunch) { btnLaunch.removeEventListener('click', handleFullscreen) }
-    })
     return () => {
       const defaultSlot = renderSlot(useSlots(), 'default')
-      // fullscreen-target 全屏元素属性
-      // fullscreen-launch 全屏事件属性
       // if (defaultSlot.children.length === 0) throw new Error('未发现全屏元素')
-      // const targetElement = document.querySelector('[fullscreen-target]')
       return (
-        <div class="d-fullscreen">
-          <div>{ defaultSlot }</div>
-        </div>
+        <div ref={slotElement}>{ defaultSlot }</div>
       )
     }
   }
diff --git a/devui/skeleton/src/skeleton.scss b/devui/skeleton/src/skeleton.scss
index f273c771aba0975ec36a64d455a8c19cfc2dfcc2..ab0fadc0641cdc3868c3eb0e82aca2cfe0a36d0e 100644
--- a/devui/skeleton/src/skeleton.scss
+++ b/devui/skeleton/src/skeleton.scss
@@ -1,32 +1,39 @@
 .devui-skeleton {
   display: flex;
   justify-content: space-between;
+
   .devui-skeleton__avatar {
     display: none;
+
     .avatar {
       width: 40px;
       height: 40px;
-      background-color: #ccc;
+      background-color: #cccccc;
       border-radius: 50%;
     }
   }
+
   .is-shown {
     flex: 1;
     display: flex;
     justify-content: center;
   }
+
   .devui-skeleton__item__group {
     flex: 7;
+
     .devui-skeleton__item {
       width: 100%;
       height: 16px;
-      background-color: #ccc;
+      background-color: #cccccc;
       display: inline-block;
       border-radius: 4px;
     }
+
     .devui-skeleton__item:first-child {
       width: 33%;
     }
+
     .devui-skeleton__item:last-child {
       width: 61%;
     }
@@ -35,18 +42,19 @@
 
 .devui-skeleton-animated > .devui-skeleton__avatar > .avatar,
 .devui-skeleton-animated > .devui-skeleton__item__group > .devui-skeleton__item {
-  background-color: #ccc;
-  background: linear-gradient(
-      100deg,
-      rgba(255, 255, 255, 0) 40%,
-      rgba(255, 255, 255, 0.5) 50%,
-      rgba(255, 255, 255, 0) 60%
-    )
-    #ccc;
+  background-color: #cccccc;
+  // background: linear-gradient(
+  //     100deg,
+  //     rgba(255, 255, 255, 0) 40%,
+  //     rgba(255, 255, 255, 0.5) 50%,
+  //     rgba(255, 255, 255, 0) 60%
+  //   )
+  //   #ccc;
   background-size: 200% 100%;
   background-position-x: 180%;
   animation: 2s loading ease-in-out infinite;
 }
+
 .devui-skeleton-animated > .devui-skeleton__avatar > .avatar {
   animation-delay: 0.1s;
 }
diff --git a/devui/skeleton/src/skeleton.tsx b/devui/skeleton/src/skeleton.tsx
index 6076a06390c89b73ce3fdea37b2e62698d1df664..4e6bc3cbb7428ae2df0b72518fc9c246af0629af 100644
--- a/devui/skeleton/src/skeleton.tsx
+++ b/devui/skeleton/src/skeleton.tsx
@@ -8,7 +8,7 @@ export default defineComponent({
   props: skeletonProps,
   setup(props: SkeletonProps, ctx) {
     const { slots } = ctx;
-    let arr = []
+    const arr = []
     for (let index = 0; index < props.row; index++) {
       arr.push(1)
     }
diff --git a/docs/components/fullscreen/index.md b/docs/components/fullscreen/index.md
index 945770e76e932f80577b5098dd8ea993f1796749..bf943b24e8bda83821dd9b709be11a76559a3b77 100644
--- a/docs/components/fullscreen/index.md
+++ b/docs/components/fullscreen/index.md
@@ -8,9 +8,39 @@
 
 ### 沉浸式全屏
 
-充满整个显示器屏幕的沉浸式全屏（待完善）。
+充满整个显示器屏幕的沉浸式全屏。
 
+:::demo
 
+```vue
+<template>
+  <d-fullscreen :zIndex='100' @fullscreenLaunch='fullscreenLaunch'>
+    <div fullscreen-target>
+      <d-button fullscreen-launch>{{btnContent}}</d-button>
+    </div>
+  </d-fullscreen>
+</template>
+<script>
+import { ref } from 'vue'
+export default {
+  setup() {
+    const btnContent = ref('FullScreen')
+    const fullscreenLaunch = (val) => {
+      if (val) {
+        btnContent.value = 'Exit'
+      } else {
+        btnContent.value = 'FullScreen'
+      }
+    }
+    return {
+      btnContent,
+      fullscreenLaunch
+    }
+  }
+}
+</script>
+```
+:::
 
 ### 普通全屏
 
@@ -42,7 +72,7 @@ export default {
       btnContent,
       fullscreenLaunch
     }
-  },
+  }
 }
 </script>
 ```
@@ -54,4 +84,10 @@ export default {
 | :---------: | :------: | :-------: | :----------------------- |
 |    mode     | `immersive` 或 `normal` |    `immersive`    | 可选，设置全屏模式          |
 |    zIndex     | `Number` |  10  | 可选，设置全屏层级           |
-|    fullscreenLaunch    | `EventEmitter<boolean>` |  | 可选，全屏之后的回调           |
\ No newline at end of file
+|    fullscreenLaunch    | `EventEmitter<boolean>` |  | 可选，全屏之后的回调           |
+
+**fullscreen-target** 选择器
+必含指令，内容投影，设置**需要全屏的元素**沉浸式全屏。
+
+**fullscreen-launch** 选择器
+必含指令，内容投影，设置**触发**进入全屏的按钮沉浸式全屏。
\ No newline at end of file