diff --git a/config/demo.php b/config/demo.php
new file mode 100644
index 0000000..0456337
--- /dev/null
+++ b/config/demo.php
@@ -0,0 +1,8 @@
+<?php
+
+return [
+    'descriptions' => [
+        'title' => '描述列表',
+        'desc' => '预览表单/表格'
+    ]
+];
diff --git a/database/seeds/InitPost.php b/database/seeds/InitPost.php
new file mode 100644
index 0000000..4a6f74f
--- /dev/null
+++ b/database/seeds/InitPost.php
@@ -0,0 +1,61 @@
+<?php
+
+use app\model\Category;
+use app\model\Post;
+use think\facade\App;
+use think\facade\Config;
+use think\migration\Seeder;
+
+class InitPost extends Seeder
+{
+    /**
+     * Run Method.
+     *
+     * Write your database seeder using this method.
+     *
+     * More information on writing seeders is available here:
+     * http://docs.phinx.org/en/latest/seeding.html
+     */
+    public function run()
+    {
+        $list_category = ['起步' => [], '组件' => ['tpl_name' => 'pc'], '扩展' => []];
+
+        foreach ($list_category as $category_title => &$category_data) {
+            $model_category =  Category::where('title', $category_title)->find();
+
+            if (empty($model_category)) {
+                $model_category = Category::create([
+                    'title' => $category_title,
+                    'tpl_name' => $category_data['tpl_name'] ?? '',
+                    'status' => 1
+                ]);
+            }
+
+            $category_data['model'] = $model_category;
+        }
+
+        $demo_pc_dir = App::getRootPath() . '/demo/pc';
+
+        $list_demo_file = scandir($demo_pc_dir);
+
+
+
+        foreach ($list_demo_file as  $file_name) {
+            $file_name = str_replace(['.html', '.', '..',], '', $file_name);
+
+            if (empty($file_name)) {
+                continue;
+            }
+
+            $model_post = Post::where('tpl_name', $file_name)->find();
+            if (empty($model_post)) {
+                $model_post = new Post();
+                $model_post->tpl_name = $file_name;
+                $model_post->title = Config::get("demo.{$file_name}.title", $file_name);
+                $model_post->desc = Config::get("demo.{$file_name}.desc", $file_name);
+                $model_post->category_id = $list_category['组件']['model']['id'];
+                $model_post->save();
+            }
+        }
+    }
+}
diff --git a/demo/pc/descriptions.html b/demo/pc/descriptions.html
new file mode 100644
index 0000000..92544c5
--- /dev/null
+++ b/demo/pc/descriptions.html
@@ -0,0 +1,55 @@
+<fieldset class="layui-elem-field layui-field-title">
+    <legend>描述列表</legend>
+    <div class="layui-field-box">
+        <div class="ul-descriptions">
+            <div class="item">
+                <div class="label">
+                    昵称
+                </div>
+                <div class="value">
+                    奥古斯宏
+                </div>
+            </div>
+            <div class="item">
+                <div class="label">
+                    手机号
+                </div>
+                <div class="value">
+                    13000000001
+                </div>
+            </div>
+            <div class="item">
+                <div class="label">
+                    地址
+                </div>
+                <div class="value">
+                    山东省临沂市兰山区
+                </div>
+            </div>
+            <div class="item">
+                <div class="label">
+                    身份证号
+                </div>
+                <div class="value">
+                    371302199700000000
+                </div>
+            </div>
+            <div class="item">
+                <div class="label">
+                    核酸状态
+                </div>
+                <div class="value">
+                    阴性
+                </div>
+            </div>
+            <div class="item">
+                <div class="label">
+                    民族
+                </div>
+                <div class="value">
+                    汉
+                </div>
+            </div>
+        </div>
+    </div>
+</fieldset>
\ No newline at end of file
diff --git a/source/scss/desciptions/_desciptions.scss b/source/scss/desciptions/_desciptions.scss
new file mode 100644
index 0000000..5c496b8
--- /dev/null
+++ b/source/scss/desciptions/_desciptions.scss
@@ -0,0 +1,34 @@
+.ul-descriptions {
+
+    display:flex;
+    flex-wrap: wrap;
+
+
+    .item {
+        display : inline-flex;
+        width   : 30%;
+        position: relative;
+        height  : 40px;
+
+        
+
+        .label {
+
+            width   : calc(40% - 12px);
+            padding : 12px 6px;
+            position: absolute;
+
+        }
+
+        .value {
+            position       : absolute;
+            width          : 60%;
+            margin-left    : 40%;
+            display        : flex;
+            align-items    : center;
+            justify-content: left;
+            
+            height         : 100%
+        }
+    }
+}
\ No newline at end of file
diff --git a/source/scss/desciptions/_index.scss b/source/scss/desciptions/_index.scss
new file mode 100644
index 0000000..6710898
--- /dev/null
+++ b/source/scss/desciptions/_index.scss
@@ -0,0 +1 @@
+@import './desciptions';
\ No newline at end of file
diff --git a/source/scss/layui-ul.scss b/source/scss/layui-ul.scss
index 35a6e8e..ba68ac8 100644
--- a/source/scss/layui-ul.scss
+++ b/source/scss/layui-ul.scss
@@ -7,6 +7,7 @@
 @import './title/index';
 @import './jumbotron/index';
 @import './footer/index';
+@import './desciptions/index';
 
 
 /* 头部开始 */