diff --git a/CHANGELOG.md b/CHANGELOG.md
index 5148d16e2..efc64b52b 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -3,6 +3,8 @@
 ## 1.4.6
 
 - 修复：`<Select />` 组件搜索特殊字符造成的崩溃问题 [#294](https://github.com/XiaoMi/hiui/issues/294)
+- 修复：`<Form />` 组件 `label` 文字超长时造成的浮动问题 [#295](https://github.com/XiaoMi/hiui/issues/295)
+- 修复：`<Form />` 组件验证规则未写 `trigger` 时也会触发验证的问题 [#296](https://github.com/XiaoMi/hiui/issues/296)
 
 ## 1.4.5
 
diff --git a/components/form/index.js b/components/form/index.js
index 6f90c5f1b..7f05107cc 100644
--- a/components/form/index.js
+++ b/components/form/index.js
@@ -1,4 +1,4 @@
-import React, {Component} from 'react'
+import React, { Component } from 'react'
 import classNames from 'classnames'
 import Item from './item'
 import './style/index'
@@ -24,7 +24,7 @@ class Form extends Component {
   }
 
   getClassNames () {
-    const {labelPosition, inline} = this.props
+    const { labelPosition, inline } = this.props
 
     const obj = {}
 
@@ -40,13 +40,15 @@ class Form extends Component {
   }
 
   addField (field) {
-    this.setState(prevState => ({
+    this.setState((prevState) => ({
       fields: prevState.fields.concat(field)
     }))
   }
 
   removeField (prop) {
-    const fields = this.state.fields.filter(field => field.props.prop !== prop)
+    const fields = this.state.fields.filter(
+      (field) => field.props.prop !== prop
+    )
 
     this.setState({
       fields
@@ -62,8 +64,8 @@ class Form extends Component {
       cb(valid)
     }
 
-    fields.forEach(field => {
-      field.validate('', errors => {
+    fields.forEach((field) => {
+      field.validate('', (errors) => {
         if (errors) {
           valid = false
         } else {
@@ -76,23 +78,25 @@ class Form extends Component {
   }
 
   validateField (key, cb) {
-    const field = this.state.fields.filter(field => field.props.prop === key)[0]
+    const field = this.state.fields.filter(
+      (field) => field.props.prop === key
+    )[0]
 
     if (!field) {
-      throw new Error('must call validateField with valid key string!')
+      throw new Error('must call validate Field with valid key string!')
     }
 
     field.validate('', cb)
   }
 
   resetValidates () {
-    this.state.fields.forEach(field => {
+    this.state.fields.forEach((field) => {
       field.resetValidate()
     })
   }
 
   render () {
-    const {children} = this.props
+    const { children } = this.props
 
     return (
       <form className={classNames('hi-form', this.getClassNames())}>
diff --git a/components/form/item.js b/components/form/item.js
index fe2d5367d..1d8fa31a0 100644
--- a/components/form/item.js
+++ b/components/form/item.js
@@ -54,8 +54,7 @@ class FormItem extends Component {
 
   getFilteredRule (trigger) {
     const rules = this.getRules()
-
-    return rules.filter(rule => {
+    return rules.filter((rule) => {
       return !rule.trigger || rule.trigger.indexOf(trigger) !== -1
     })
   }
@@ -129,11 +128,21 @@ class FormItem extends Component {
   }
 
   handleFieldBlur () {
-    this.validate('onBlur')
+    const hasOnBlur = this.getRules().some((rule) =>
+      (rule.trigger || '').includes('onBlur')
+    )
+    if (hasOnBlur) {
+      this.validate('onBlur')
+    }
   }
 
   handleFieldChange () {
-    this.validate('onChange')
+    const hasOnChange = this.getRules().some((rule) =>
+      (rule.trigger || '').includes('onChange')
+    )
+    if (hasOnChange) {
+      this.validate('onChange')
+    }
   }
 
   get labelWidth () {
@@ -153,33 +162,34 @@ class FormItem extends Component {
 
     return (
       <div className={classNames('hi-form-item', className, obj)}>
-        {
-          label && (
-            <label className={'hi-form-item' + '__label'} style={{ 'width': this.labelWidth }}>
-              {label}
-            </label>
-          )
-        }
-        <div className={'hi-form-item' + '__content'} style={{ 'marginLeft': this.labelWidth }}>
-          {
-            (Array.isArray(children) || !children)
-              ? children
-              : React.cloneElement(children, {
-                onChange: (...args) => {
-                  children.props.onChange && children.props.onChange(...args)
-                  setTimeout(() => {
-                    this.handleFieldChange()
-                  })
-                },
-                onBlur: (...args) => {
-                  children.props.onBlur && children.props.onBlur(...args)
-                  setTimeout(() => {
-                    this.handleFieldBlur()
-                  })
-                }
-              })
-          }
-          { error && <div className='hi-form-item__error'>{error}</div> }
+        {label ? (
+          <label
+            className={'hi-form-item' + '__label'}
+            style={{ width: this.labelWidth }}
+          >
+            {label}：
+          </label>
+        ) : (
+          <span style={{ width: this.labelWidth }} />
+        )}
+        <div className={'hi-form-item' + '__content'}>
+          {Array.isArray(children) || !children
+            ? children
+            : React.cloneElement(children, {
+              onChange: (...args) => {
+                children.props.onChange && children.props.onChange(...args)
+                setTimeout(() => {
+                  this.handleFieldChange()
+                })
+              },
+              onBlur: (...args) => {
+                children.props.onBlur && children.props.onBlur(...args)
+                setTimeout(() => {
+                  this.handleFieldBlur()
+                })
+              }
+            })}
+          <div className='hi-form-item--msg__error'>{error}</div>
         </div>
       </div>
     )
diff --git a/components/form/style/index.scss b/components/form/style/index.scss
index 79611fd19..0bf18cbac 100644
--- a/components/form/style/index.scss
+++ b/components/form/style/index.scss
@@ -1,6 +1,7 @@
 @import '@hi-ui/core-css/index.scss';
 
 .hi-form {
+  max-width: 100%;
   position: relative;
 
   fieldset {
@@ -18,6 +19,11 @@
     color: $gray-darker;
   }
 
+  &--inline {
+    display: flex;
+    align-items: center;
+  }
+
   &__title {
     box-sizing: border-box;
     margin-top: 0;
@@ -25,65 +31,66 @@
     font-size: 16px;
     font-weight: 400;
   }
-}
-
-.hi-form-item {
-  font-size: $font-size-normal;
-  margin-right: $spacer-2;
-  // margin-top: 4px;
-  // margin-bottom: 4px;
-  padding: $spacer-2 0;
 
-  & + & {
-    // margin-top: $spacer-2;
+  &--label--left {
+    .hi-form-item__label {
+      text-align: left;
+    }
+  }
 
-    .hi-form--inline & {
-      // margin-top: 0;
+  &--label--right {
+    .hi-form-item__label {
+      text-align: right;
     }
   }
 
-  .hi-form--inline & {
-    display: inline-block;
-    vertical-align: top;
+  &--label--top {
+    padding-right: 0;
+    text-align: left;
+
+    .hi-form-item {
+      flex-direction: column;
+    }
   }
+}
+
+.hi-form-item {
+  display: flex;
+  font-size: $font-size-normal;
+  margin-right: $spacer-2;
 
   &__label {
-    float: left;
-    box-sizing: border-box;
-    padding-right: $spacer-3;
+    flex-shrink: 0;
+    min-height: 32px;
     line-height: 32px;
+    box-sizing: border-box;
+    padding-right: $spacer-2;
     vertical-align: top;
     color: $gray-darker;
-
-    .hi-form--label--left & {
-      text-align: left;
-    }
-
-    .hi-form--label--right & {
-      text-align: right;
-    }
-
-    .hi-form--label--top & {
-      float: none;
-      padding-right: 0;
-      text-align: left;
-    }
+    overflow-wrap: break-word;
   }
 
   &__content {
+    flex: 1;
     position: relative;
     vertical-align: top;
+    min-height: 32px;
+    line-height: 32px;
   }
 
   &__error {
-    position: absolute;
-    top: 0;
-    left: 100%;
-    margin-left: $spacer-2;
+    .hi-input__inner {
+      border-color: get-color($palette-secondary, 'danger');
+    }
+  }
+
+  &--msg__error {
     font-size: $font-size-small;
-    line-height: 32px;
-    white-space: nowrap;
-    color: #ff4949;
+    min-height: 24px;
+    padding: 2px 0;
+    box-sizing: border-box;
+    line-height: 20px;
+    color: get-color($palette-secondary, 'danger');
 
     .hi-form--inline & {
       top: 36px;
diff --git a/docs/en-US/components/form.md b/docs/en-US/components/form.md
index 6c44c9ca6..17c3f8974 100644
--- a/docs/en-US/components/form.md
+++ b/docs/en-US/components/form.md
@@ -12,7 +12,6 @@
 
 constructor() {
   super()
-
   this.state = {
     checkedIndex: 0,
     alignList: [
@@ -33,40 +32,34 @@ constructor() {
   }
 }
 
-
 render(){
   const {position, checkedIndex} = this.state
   return (
     <div>
-      <div>
-        <Radio 
-          list={this.state.alignList} 
-          mode='button'
-          checked={checkedIndex}
-          onChange={(data, index) => {
-            
-            this.setState({
-              position: data,
-              checkedIndex: index
-            })
-          }}
-        />
-        <br />
-        <br />
-        <Form labelWidth="80" labelPosition={this.state.position}>
-          <FormItem label={'name'}>
-            <Input placeholder={'username'} />
-          </FormItem>
-
-          <FormItem label={'phone'}  >
-            <Input placeholder={'phone'} />
-          </FormItem>
-
-          <FormItem>
-            <Button type={'primary'}>submit</Button>
-          </FormItem>
-        </Form>
-       </div>
+      <Radio
+        list={this.state.alignList}
+        mode='button'
+        checked={checkedIndex}
+        onChange={(data, index) => {
+          this.setState({
+            position: data,
+            checkedIndex: index
+          })
+        }}
+      />
+      <br />
+      <br />
+      <Form labelWidth="80" labelPosition={this.state.position}>
+        <FormItem label='name'>
+          <Input placeholder='username' />
+        </FormItem>
+        <FormItem label='phone'  >
+          <Input placeholder='phone' />
+        </FormItem>
+        <FormItem>
+          <Button type='primary'>submit</Button>
+        </FormItem>
+      </Form>
     </div>
   )
 }
@@ -83,21 +76,17 @@ render(){
 
 render(){
   return (
-    <div>
-      <div>
-         <Form inline={true}>
-            <FormItem label="username" labelWidth="80">
-              <Input placeholder={'username'} />
-            </FormItem>
-            <FormItem label="password" labelWidth="80">
-              <Input placeholder={'password'} />
-            </FormItem>
-            <FormItem>
-              <Button type={'primary'}>submit</Button>
-            </FormItem>
-          </Form>
-       </div>
-    </div>
+    <Form inline={true}>
+      <FormItem label="username" labelWidth="80">
+        <Input placeholder='username' />
+      </FormItem>
+      <FormItem label="password" labelWidth="80">
+        <Input placeholder='password' />
+      </FormItem>
+      <FormItem>
+        <Button type='primary'>submit</Button>
+      </FormItem>
+    </Form>
   )
 }
 ```
@@ -113,9 +102,7 @@ render(){
 
 constructor(props) {
   super(props)
-
   this.form = React.createRef()
-
   this.state = {
     form: {
       name: '',
@@ -127,8 +114,8 @@ constructor(props) {
       name: [
         {
           required: true,
-          message: <span style={{color: '#ccc'}}>input name</span>,
-          trigger: 'blur,change'
+          message: <span><Icon name="close-circle"/> input name</span>,
+          trigger: 'onBlur,onChange'
         }
       ],
       region: [
@@ -154,7 +141,7 @@ constructor(props) {
               cb()
             }
           },
-          trigger: 'change'
+          trigger: 'onChange'
         }
       ]
     }
@@ -192,28 +179,32 @@ render(){
   const {form, checkedIndex} = this.state
 
   return (
-    <div>
-      <div>
-         <Form ref={this.form} model={form} rules={this.state.rules} labelWidth="80">
-            <FormItem label="Name" prop="name">
-              <Input value={form.name} placeholder={'name'} onChange={this.handleChange.bind(this, 'name')}/>
-            </FormItem>
-            <FormItem label="Count" prop="count">
-              <Input value={form.count} placeholder={'count'} onChange={this.handleChange.bind(this, 'count')}/>
-            </FormItem>
-            <FormItem label="Area" prop="region">
-              <Radio 
-                list={['Beijing', 'ShangHai', 'ChongQing']} 
-                checked={checkedIndex}
-                onChange={this.handleChange.bind(this, 'region','')}
-              />
-            </FormItem>
-            <FormItem>
-              <Button type={'primary'} onClick={this.handleSubmit.bind(this)}>Submit</Button>
-            </FormItem>
-          </Form>
-       </div>
-    </div>
+    <Form ref={this.form} model={form} rules={this.state.rules} labelWidth="80">
+      <FormItem label="Name" prop="name">
+        <Input value={form.name} placeholder='name' onChange={this.handleChange.bind(this, 'name')}/>
+      </FormItem>
+      <FormItem label="Count" prop="count">
+        <Input value={form.count} placeholder='count' onChange={this.handleChange.bind(this, 'count')}/>
+      </FormItem>
+      <FormItem label="Area" prop="region">
+        <Radio
+          list={[{
+            name: 'BeiJing',
+            id: 1
+          }, {
+            name: 'ShangHai',
+            id: 2
+          }, {
+            name: 'WuHan',
+            id: 3
+          }]}
+          onChange={this.handleChange.bind(this, 'region', null)}
+        />
+      </FormItem>
+      <FormItem>
+        <Button type={'primary'} onClick={this.handleSubmit.bind(this)}>Submit</Button>
+      </FormItem>
+    </Form>
   )
 }
 ```
diff --git a/docs/zh-CN/components/form.md b/docs/zh-CN/components/form.md
index ec501840b..e51af290f 100644
--- a/docs/zh-CN/components/form.md
+++ b/docs/zh-CN/components/form.md
@@ -7,7 +7,6 @@
 ```js
 constructor() {
   super()
-
   this.state = {
     alignCheckedIndex: 0,
     alignList: [
@@ -45,14 +44,13 @@ constructor() {
 }
 
 render(){
-  const {position, alignCheckedIndex, columnCheckedIndex} = this.state
+  const { position, alignCheckedIndex, columnCheckedIndex } = this.state
   const Row = Grid.Row
   const Col = Grid.Col
   return (
     <div>
       <Row gutter={true}>
         <Col span={12}>
-
           <Radio
             list={this.state.alignList}
             mode='button'
@@ -64,10 +62,8 @@ render(){
               })
             }}
           />
-
         </Col>
         <Col span={12}>
-
           <Radio
             list={this.state.columnList}
             mode='button'
@@ -79,26 +75,21 @@ render(){
               })
             }}
           />
-
         </Col>
       </Row>
       <Row gutter={true}>
         <Col span={this.state.column}>
-
           <Form labelWidth='80' labelPosition={this.state.position}>
-            <FormItem label={'姓名'}>
-              <Input placeholder={'username'} />
+            <FormItem label='姓名'>
+              <Input placeholder='username' />
             </FormItem>
-
-            <FormItem label={'手机号码'}  >
-              <Input placeholder={'phone'} />
+            <FormItem label='手机号码' >
+              <Input placeholder='phone' />
             </FormItem>
-
             <FormItem>
-              <Button type={'primary'}>提交</Button>
+              <Button type='primary'>提交</Button>
             </FormItem>
           </Form>
-
         </Col>
       </Row>
     </div>
@@ -114,21 +105,17 @@ render(){
 ```js
 render(){
   return (
-    <div>
-      <div>
-         <Form inline={true}>
-            <FormItem label='账号' labelWidth='50'>
-              <Input placeholder={'账号'} />
-            </FormItem>
-            <FormItem label='密码' labelWidth='50'>
-              <Input type='password' placeholder={'密码'} />
-            </FormItem>
-            <FormItem>
-              <Button type={'primary'}>提交</Button>
-            </FormItem>
-          </Form>
-       </div>
-    </div>
+    <Form inline>
+      <FormItem label='账号' labelWidth='50'>
+        <Input placeholder='账号' />
+      </FormItem>
+      <FormItem label='密码' labelWidth='50'>
+        <Input type='password' placeholder='密码' />
+      </FormItem>
+      <FormItem>
+        <Button type='primary'>提交</Button>
+      </FormItem>
+    </Form>
   )
 }
 ```
@@ -155,7 +142,7 @@ constructor(props) {
       name: [
         {
           required: true,
-          message: <span style={{color: '#ccc'}}>请输入名称</span>,
+          message: <span><Icon name="close-circle"/>  请输入名称</span>,
           trigger: 'onBlur,onChange'
         }
       ],
@@ -207,7 +194,8 @@ cancelSubmit() {
     form: {
       name: '',
       region: '',
-      count: ''
+      count: '',
+      type: []
     }
   })
   this.form.resetValidates()
@@ -228,36 +216,37 @@ handleChange(key, e, value, index) {
 render(){
   const Row = Grid.Row
   const Col = Grid.Col
-  const {form, checkedIndex} = this.state
-
+  const {form} = this.state
   return (
-    <div>
+    <Col span={12}>
       <Form ref={node => this.form = node} model={form} rules={this.state.rules} labelWidth='80'>
-        <Row>
-          <Col span={12}>
-
-            <FormItem label='名称' prop='name'>
-              <Input value={form.name} placeholder={'name'} onChange={this.handleChange.bind(this, 'name')}/>
-            </FormItem>
-            <FormItem label='数量' prop='count'>
-              <Input value={form.count} placeholder={'count'} onChange={this.handleChange.bind(this, 'count')}/>
-            </FormItem>
-            <FormItem label='地区' prop='region'>
-              <Radio
-                list={['北京', '上海', '重庆']}
-                checked={checkedIndex}
-                onChange={this.handleChange.bind(this, 'region','')}
-              />
-            </FormItem>
-            <FormItem>
-              <Button type='primary' onClick={this.handleSubmit.bind(this)}>提交</Button>
-              <Button onClick={this.cancelSubmit.bind(this)}>重置</Button>
-            </FormItem>
-
-          </Col>
-        </Row>
+          <FormItem label='名称' prop='name'>
+            <Input value={form.name} placeholder='name' onChange={this.handleChange.bind(this, 'name')}/>
+          </FormItem>
+          <FormItem label='数量' prop='count'>
+            <Input value={form.count} placeholder='count' onChange={this.handleChange.bind(this, 'count')}/>
+          </FormItem>
+          <FormItem label='地区' prop='region'>
+            <Radio
+              list={[{
+                name: '北京',
+                id: 1
+              }, {
+                name: '上海',
+                id: 2
+              }, {
+                name: '武汉',
+                id: 3
+              }]}
+              onChange={this.handleChange.bind(this, 'region', null)}
+            />
+          </FormItem>
+          <FormItem>
+            <Button type='primary' onClick={this.handleSubmit.bind(this)}>提交</Button>
+            <Button onClick={this.cancelSubmit.bind(this)}>重置</Button>
+          </FormItem>
       </Form>
-    </div>
+    </Col>
   )
 }
 ```
@@ -287,8 +276,8 @@ render(){
 
 ### Form Methods
 
-| 方法名| 说明|
-| --- | --- |
-| validate(callback) | 对整个表单进行校验 |
-| validateField(prop, callback) | 对表单字段进行校验 |
-| resetValidates | 重置整个表单的验证 |
+| 方法名                        | 说明               | 回调参数                                 |
+| ----------------------------- | ------------------ | ---------------------------------------- |
+| validate(callback)            | 对整个表单进行校验 | (valid: boolean) => void                 |
+| validateField(prop, callback) | 对表单字段进行校验 | (prop: string, (valid: boolean) => void) |
+| resetValidates()              | 重置整个表单的验证 | -                                        |