diff --git a/examples/routers/list.vue b/examples/routers/list.vue
index d8c800fb..82ca54df 100644
--- a/examples/routers/list.vue
+++ b/examples/routers/list.vue
@@ -1,26 +1,75 @@
 <template>
     <div>
-        <h2>small size</h2>
-        <List header="Header" footer="Footer" size="small" :split="false">
-            <ListItem v-for="item in data1" :key="item">
-                {{ item }}
-            </ListItem>
-        </List>
-        <h2>default size</h2>
-        <List header="Header" footer="Footer">
-            <ListItem v-for="item in data1" :key="item">
-                {{ item }}
-            </ListItem>
-        </List>
-        <h2>large size</h2>
-        <List header="Header" footer="Footer" border size="large">
-            <ListItem v-for="item in data1" :key="item">
-                {{ item }}
+<!--        <h2>small size</h2>-->
+<!--        <List header="Header" footer="Footer" size="small" :split="false">-->
+<!--            <ListItem v-for="item in data1" :key="item">-->
+<!--                {{ item }}-->
+<!--            </ListItem>-->
+<!--        </List>-->
+<!--        <h2>default size</h2>-->
+<!--        <List header="Header" footer="Footer">-->
+<!--            <ListItem v-for="item in data1" :key="item">-->
+<!--                {{ item }}-->
+<!--            </ListItem>-->
+<!--        </List>-->
+<!--        <h2>large size</h2>-->
+<!--        <List header="Header" footer="Footer" border size="large">-->
+<!--            <ListItem v-for="item in data1" :key="item">-->
+<!--                {{ item }}-->
+<!--            </ListItem>-->
+<!--        </List>-->
+
+<!--        <Divider>没有 </Divider>-->
+
+<!--        <List>-->
+<!--            <ListItem v-for="item in data2" :key="item.title">-->
+<!--                <ListItemMeta :avatar="item.avatar" :title="item.title" :description="item.description">-->
+<!--                </ListItemMeta>-->
+<!--                一段内容-->
+<!--            </ListItem>-->
+<!--        </List>-->
+
+        <Divider>带有 Action</Divider>
+
+        <List>
+            <ListItem v-for="item in data2" :key="item.title">
+                <ListItemMeta :avatar="item.avatar" :title="item.title" :description="item.description">
+
+                </ListItemMeta>
+                一段内容
+                <template slot="action">
+                    <li>
+                        <a href="">edit</a>
+<!--                        <Button typr="primary">编辑</Button>-->
+                    </li>
+                    <li>
+                        <a href="">more</a>
+<!--                        <Button>删除</Button>-->
+                    </li>
+                </template>
             </ListItem>
         </List>
 
-        <Divider></Divider>
+<!--        <Divider>带图片</Divider>-->
+<!--        <List item-layout="vertical">-->
+<!--            <ListItem v-for="item in data2" :key="item.title">-->
+<!--                <ListItemMeta :avatar="item.avatar" :title="item.title" :description="item.description">-->
 
+<!--                </ListItemMeta>-->
+<!--                We supply a series of design principles, practical patterns and high quality design resources (Sketch and Axure), to help people create their product prototypes beautifully and efficiently.-->
+<!--&lt;!&ndash;                <template slot="action">&ndash;&gt;-->
+<!--&lt;!&ndash;                    <li>&ndash;&gt;-->
+<!--&lt;!&ndash;                        <Icon type="ios-star-outline" /> 156&ndash;&gt;-->
+<!--&lt;!&ndash;                    </li>&ndash;&gt;-->
+<!--&lt;!&ndash;                    <li>&ndash;&gt;-->
+<!--&lt;!&ndash;                        <Icon type="ios-thumbs-up-outline" /> 156&ndash;&gt;-->
+<!--&lt;!&ndash;                    </li>&ndash;&gt;-->
+<!--&lt;!&ndash;                    <li>&ndash;&gt;-->
+<!--&lt;!&ndash;                        <Icon type="ios-chatbubbles-outline" /> 10&ndash;&gt;-->
+<!--&lt;!&ndash;                    </li>&ndash;&gt;-->
+<!--&lt;!&ndash;                </template>&ndash;&gt;-->
+<!--            </ListItem>-->
+<!--        </List>-->
 
     </div>
 </template>
@@ -34,6 +83,33 @@
                     'Australian walks 100km after outback crash.',
                     'Man charged over missing wedding girl.',
                     'Los Angeles battles huge wildfires.',
+                ],
+                data2: [
+                    {
+                        title: 'This is a title 1',
+                        description: 'This is the description, This is the description, This is the description.',
+                        avatar: 'https://dev-file.iviewui.com/userinfoPDvn9gKWYihR24SpgC319vXY8qniCqj4/avatar'
+                    },
+                    {
+                        title: 'This is a title 2',
+                        description: 'This is the description, This is the description, This is the description.',
+                        avatar: 'https://dev-file.iviewui.com/userinfoPDvn9gKWYihR24SpgC319vXY8qniCqj4/avatar'
+                    },
+                    {
+                        title: 'This is a title 3',
+                        description: 'This is the description, This is the description, This is the description.',
+                        avatar: 'https://dev-file.iviewui.com/userinfoPDvn9gKWYihR24SpgC319vXY8qniCqj4/avatar'
+                    },
+                    {
+                        title: 'This is a title 4',
+                        description: 'This is the description, This is the description, This is the description.',
+                        avatar: 'https://dev-file.iviewui.com/userinfoPDvn9gKWYihR24SpgC319vXY8qniCqj4/avatar'
+                    },
+                    {
+                        title: 'This is a title 5',
+                        description: 'This is the description, This is the description, This is the description.',
+                        avatar: 'https://dev-file.iviewui.com/userinfoPDvn9gKWYihR24SpgC319vXY8qniCqj4/avatar'
+                    }
                 ]
             };
         }
diff --git a/src/components/list/list-item.vue b/src/components/list/list-item.vue
index abd6f319..c48a4d56 100644
--- a/src/components/list/list-item.vue
+++ b/src/components/list/list-item.vue
@@ -1,13 +1,36 @@
 <template>
-    <li class="ivu-list-item">
+    <li class="ivu-list-item" :class="classes">
         <slot></slot>
+        <ul class="ivu-list-item-action" v-if="$slots.action">
+            <slot name="action"></slot>
+        </ul>
     </li>
 </template>
 <script>
     export default {
         name: 'ListItem',
+        inject: ['ListInstance'],
         props: {
 
+        },
+        computed: {
+            isFlexMode () {
+                const extra = this.$slots.extra;
+                const itemLayout = this.ListInstance.itemLayout;
+
+                if (itemLayout === 'vertical') {
+                    return !!extra;
+                }
+
+                return !this.$slots.default;
+            },
+            classes () {
+                return [
+                    {
+                        'ivu-list-item-no-flex': !this.isFlexMode
+                    }
+                ];
+            }
         }
     };
 </script>
diff --git a/src/components/list/list.vue b/src/components/list/list.vue
index c931dfc4..b51cf976 100644
--- a/src/components/list/list.vue
+++ b/src/components/list/list.vue
@@ -4,7 +4,7 @@
         <div class="ivu-list-container">
             <ul class="ivu-list-items"><slot></slot></ul>
         </div>
-        <Spin v-if="loading"><slot name="spin"></slot></Spin>
+        <Spin v-if="loading" fix size="large"><slot name="spin"></slot></Spin>
         <div class="ivu-list-footer" v-if="footer || $slots.footer"><slot name="footer">{{ footer }}</slot></div>
     </div>
 </template>
@@ -15,6 +15,11 @@
 
     export default {
         name: 'List',
+        provide () {
+            return {
+                ListInstance: this
+            };
+        },
         props: {
             border: {
                 type: Boolean,
diff --git a/src/styles/components/list.less b/src/styles/components/list.less
index bd196232..8d8771b2 100644
--- a/src/styles/components/list.less
+++ b/src/styles/components/list.less
@@ -31,6 +31,7 @@
                 flex: 1 0;
             }
             &-title {
+                font-weight: bold;
                 margin-bottom: 4px;
                 color: @text-color;
                 font-size: @font-size-base;
@@ -65,18 +66,28 @@
                 line-height: 22px;
                 text-align: center;
                 cursor: pointer;
+
+                &:after{
+                    content: '';
+                    position: absolute;
+                    top: 50%;
+                    right: 0;
+                    width: 1px;
+                    height: 14px;
+                    margin-top: -7px;
+                    background-color: @border-color-split;
+                }
             }
             & > li:first-child {
                 padding-left: 0;
             }
+            & > li:last-child {
+                &:after{
+                    display: none;
+                }
+            }
             &-split {
-                position: absolute;
-                top: 50%;
-                right: 0;
-                width: 1px;
-                height: 14px;
-                margin-top: -7px;
-                background-color: @border-color-split;
+
             }
         }
     }
@@ -154,6 +165,20 @@
             }
         }
     }
+
+    // without flex
+    &-item-no-flex {
+        display: block;
+    }
+
+    // Horizontal
+    &:not(.@{list-prefix-cls}-vertical) {
+        .@{list-prefix-cls}-item-no-flex {
+            .@{list-prefix-cls}-item-action {
+                float: right;
+            }
+        }
+    }
 }
 
 .@{list-prefix-cls}-bordered {