diff --git a/docs/src/doc.config.js b/docs/src/doc.config.js
index a4d6bcca8..a3be1f70f 100644
--- a/docs/src/doc.config.js
+++ b/docs/src/doc.config.js
@@ -280,7 +280,7 @@ module.exports = {
               },
               {
                 path: '/card',
-                title: 'Card 卡片'
+                title: 'Card 商品卡片'
               },
               {
                 path: '/contact-card',
diff --git a/packages/card/demo/index.vue b/packages/card/demo/index.vue
index 202f4c8ba..32027f10a 100644
--- a/packages/card/demo/index.vue
+++ b/packages/card/demo/index.vue
@@ -14,6 +14,7 @@
       <van-card
         num="2"
         price="2.00"
+        origin-price="10.00"
         :tag="$t('tag')"
         :desc="$t('desc')"
         :title="$t('title')"
@@ -32,7 +33,7 @@
 export default {
   i18n: {
     'zh-CN': {
-      title: '商品标题'
+      title: '商品标题商品标题商品标题商品标题商品标题商品标题商品标题商品标题商品标题'
     }
   },
 
diff --git a/packages/card/en-US.md b/packages/card/en-US.md
index e4424551a..09bcfeb38 100644
--- a/packages/card/en-US.md
+++ b/packages/card/en-US.md
@@ -32,6 +32,7 @@ Use `slot` to custom content.
   desc="Description"  
   price="2.00"
   :thumb="imageURL"
+  origin-price="10.00"
 >
   <div slot="footer">
     <van-button size="mini">Button</van-button>
@@ -48,8 +49,9 @@ Use `slot` to custom content.
 | title | Title | `String` | - |
 | desc | Description | `String` | - |
 | tag | Tag | `String` | - |
-| num | Number of goods | `String | Number` | - |
-| price | Price of goods | `String | Number` | - |
+| num | Number | `String | Number` | - |
+| price | Price | `String | Number` | - |
+| origin-price | Origin price | `String | Number` | - |
 | centered | Whether content vertical centered | `String` | `false` |
 | currency | Currency symbol |  `String` | `¥` |
 | thumb-link | Thumb link URL | `String` | - |
diff --git a/packages/card/index.vue b/packages/card/index.vue
index 5843026cf..af920eb3a 100644
--- a/packages/card/index.vue
+++ b/packages/card/index.vue
@@ -2,7 +2,7 @@
   <div :class="b({ center: centered })">
     <a :href="thumbLink" :class="b('thumb')">
       <slot name="thumb">
-        <img :src="thumb" :class="b('img')" >
+        <img :src="thumb" :class="b('img')">
       </slot>
       <van-tag
         v-if="tag"
@@ -14,19 +14,20 @@
       </van-tag>
     </a>
     <div :class="b('content')">
-      <slot name="title">
-        <div :class="b('row')" v-if="title || isDef(price)">
+      <div :class="b('left')">
+        <slot name="title">
           <div v-if="title" :class="b('title')">{{ title }}</div>
-          <div v-if="isDef(price)" :class="b('price')">{{ currency }} {{ price }}</div>
-        </div>
-      </slot>
-      <slot name="desc">
-        <div :class="b('row')" v-if="desc || isDef(num)">
+        </slot>
+        <slot name="desc">
           <div v-if="desc" :class="[b('desc'), 'van-ellipsis']">{{ desc }}</div>
-          <div v-if="isDef(num)" :class="b('num')">x {{ num }}</div>
-        </div>
-      </slot>
-      <slot name="tags" />
+        </slot>
+        <slot name="tags" />
+      </div>
+      <div :class="b('right')">
+        <div v-if="isDef(price)">{{ currency }} {{ price }}</div>
+        <div v-if="isDef(originPrice)" :class="b('origin-price')">{{ currency }} {{ originPrice }}</div>
+        <div v-if="isDef(num)" :class="b('num')">x {{ num }}</div>
+      </div>
     </div>
     <div :class="b('footer')" v-if="$slots.footer">
       <slot name="footer" />
@@ -53,6 +54,7 @@ export default create({
     centered: Boolean,
     num: [Number, String],
     price: [Number, String],
+    originPrice: [Number, String],
     currency: {
       type: String,
       default: '¥'
diff --git a/packages/card/test/__snapshots__/demo.spec.js.snap b/packages/card/test/__snapshots__/demo.spec.js.snap
index bff4c50cb..54e888b32 100644
--- a/packages/card/test/__snapshots__/demo.spec.js.snap
+++ b/packages/card/test/__snapshots__/demo.spec.js.snap
@@ -9,12 +9,13 @@ exports[`renders demo correctly 1`] = `
         <!---->
       </a>
       <div class="van-card__content">
-        <div class="van-card__row">
-          <div class="van-card__title">商品标题</div>
-          <div class="van-card__price">¥ 2.00</div>
-        </div>
-        <div class="van-card__row">
+        <div class="van-card__left">
+          <div class="van-card__title">商品标题商品标题商品标题商品标题商品标题商品标题商品标题商品标题商品标题</div>
           <div class="van-card__desc van-ellipsis">描述信息</div>
+        </div>
+        <div class="van-card__right">
+          <div>¥ 2.00</div>
+          <!---->
           <div class="van-card__num">x 2</div>
         </div>
       </div>
@@ -28,12 +29,13 @@ exports[`renders demo correctly 1`] = `
       标签
     </span></a>
       <div class="van-card__content">
-        <div class="van-card__row">
-          <div class="van-card__title">商品标题</div>
-          <div class="van-card__price">¥ 2.00</div>
-        </div>
-        <div class="van-card__row">
+        <div class="van-card__left">
+          <div class="van-card__title">商品标题商品标题商品标题商品标题商品标题商品标题商品标题商品标题商品标题</div>
           <div class="van-card__desc van-ellipsis">描述信息</div>
+        </div>
+        <div class="van-card__right">
+          <div>¥ 2.00</div>
+          <div class="van-card__origin-price">¥ 10.00</div>
           <div class="van-card__num">x 2</div>
         </div>
       </div>
diff --git a/packages/card/zh-CN.md b/packages/card/zh-CN.md
index 5abcd1488..1d11a3da1 100644
--- a/packages/card/zh-CN.md
+++ b/packages/card/zh-CN.md
@@ -32,6 +32,7 @@ Vue.use(Card);
   desc="描述信息"  
   title="商品标题"
   :thumb="imageURL"
+  origin-price="10.00"
 >
   <div slot="footer">
     <van-button size="mini">按钮</van-button>
@@ -50,6 +51,7 @@ Vue.use(Card);
 | tag | 标签 | `String` | - |
 | num | 商品数量 | `String | Number` | - |
 | price | 商品价格 | `String | Number` | - |
+| origin-price | 商品划线原价 | `String | Number` | - |
 | centered | 内容是否垂直居中 | `String` | `false` |
 | currency | 货币符号 |  `String` | `¥` |
 | thumb-link | 点击左侧图片后的跳转链接 | `String` | - |
@@ -60,9 +62,9 @@ Vue.use(Card);
 |-----------|-----------|
 | title | 自定义标题 |
 | desc | 自定义描述 |
-| tags | 自定义 tags |
-| thumb | 自定义 thumb |
-| footer | 自定义 footer |
+| tags | 自定义描述下方的内容 |
+| thumb | 自定义图片 |
+| footer | 自定义右下角内容 |
 
 ### 更新日志
 
diff --git a/packages/vant-css/src/card.css b/packages/vant-css/src/card.css
index bd1ac2207..91f5e023b 100644
--- a/packages/vant-css/src/card.css
+++ b/packages/vant-css/src/card.css
@@ -36,7 +36,8 @@
 
   &,
   &__thumb,
-  &__row {
+  &__row,
+  &__content {
     display: flex;
   }
 
@@ -66,14 +67,22 @@
     max-height: 20px;
   }
 
-  &__price,
-  &__num {
+  &__left {
     flex: 1;
-    min-width: 80px;
+  }
+
+  &__right {
+    flex-shrink: 0;
     line-height: 20px;
+    padding-left: 10px;
     text-align: right;
   }
 
+  &__origin-price {
+    color: $gray-darker;
+    text-decoration: line-through;
+  }
+
   &__num {
     color: $gray-darker;
   }
@@ -86,7 +95,7 @@
 
   &__footer {
     right: 15px;
-    bottom: 5px;
+    bottom: 8px;
     position: absolute;
 
     .van-button {