diff --git a/examples/routers/input.vue b/examples/routers/input.vue
index 38d03903..14ffb8e3 100644
--- a/examples/routers/input.vue
+++ b/examples/routers/input.vue
@@ -1,20 +1,41 @@
 <template>
     <div>
-        {{ value1 }}
-        <Input v-model="value1" clearable icon="ios-clock-outline" size="large" placeholder="large size"></Input>
+        <Input v-model="value11" size="small">
+            <span slot="prepend">http://</span>
+            <span slot="append">.com</span>
+        </Input>
         <br>
-        <Input v-model="value2" clearable placeholder="default size"></Input>
+        <Input v-model="value12" size="small">
+            <Select v-model="select1" slot="prepend" style="width: 80px">
+                <Option value="http">http://</Option>
+                <Option value="https">https://</Option>
+            </Select>
+            <Select v-model="select2" slot="append" style="width: 70px">
+                <Option value="com">.com</Option>
+                <Option value="org">.org</Option>
+                <Option value="io">.io</Option>
+            </Select>
+        </Input>
         <br>
-        <Input v-model="value3" clearable size="small" placeholder="small size"></Input>
+        <Input v-model="value13" size="small">
+            <Select v-model="select3" slot="prepend" style="width: 80px">
+                <Option value="day">Day</Option>
+                <Option value="month">Month</Option>
+            </Select>
+            <Button slot="append" icon="ios-search"></Button>
+        </Input>
     </div>
 </template>
 <script>
     export default {
         data () {
             return {
-                value1: '',
-                value2: '',
-                value3: ''
+                value11: '',
+                value12: '',
+                value13: '',
+                select1: 'http',
+                select2: 'com',
+                select3: 'day'
             }
         }
     }
diff --git a/src/styles/mixins/input.less b/src/styles/mixins/input.less
index df008502..2b8d88b3 100644
--- a/src/styles/mixins/input.less
+++ b/src/styles/mixins/input.less
@@ -129,11 +129,15 @@
         //    border-radius: 0;
         //}
     }
-    &-with-prepend .@{inputClass} {
+    &-with-prepend .@{inputClass},
+    &-with-prepend&-small .@{inputClass}
+    {
         border-top-left-radius: 0;
         border-bottom-left-radius: 0;
     }
-    &-with-append .@{inputClass} {
+    &-with-append .@{inputClass},
+    &-with-append&-small .@{inputClass}
+    {
         border-top-right-radius: 0;
         border-bottom-right-radius: 0;
     }