diff --git a/.eslintrc.js b/.eslintrc.js
index 24a48e6993..8ccedb6db1 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -28,7 +28,6 @@ const eslintrc = {
     'arrow-body-style': 0,
     'react/sort-comp': 0,
     'react/prop-types': 0,
-    'react/jsx-closing-bracket-location': 0,
     'react/jsx-first-prop-new-line': 0,
     'import/no-unresolved': 0,
     'no-param-reassign': 0,
diff --git a/components/alert/demo/closable.md b/components/alert/demo/closable.md
index f61a98e965..fb3e14ccd1 100644
--- a/components/alert/demo/closable.md
+++ b/components/alert/demo/closable.md
@@ -16,11 +16,13 @@ ReactDOM.render(<div>
   <Alert message="警告提示的文案"
     type="warning"
     closable
-    onClose={onClose} />
+    onClose={onClose}
+  />
   <Alert message="错误提示的文案"
     description="错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍"
     type="error"
     closable
-    onClose={onClose} />
+    onClose={onClose}
+  />
 </div>, mountNode);
 ````
diff --git a/components/alert/demo/description.md b/components/alert/demo/description.md
index 482392b975..e597381225 100644
--- a/components/alert/demo/description.md
+++ b/components/alert/demo/description.md
@@ -11,17 +11,21 @@ import { Alert } from 'antd';
 ReactDOM.render(<div>
   <Alert message="成功提示的文案"
     description="成功提示的辅助性文字介绍成功提示的辅助性文字介绍成功提示的辅助性文字介绍成功提示的辅助性文字介绍"
-    type="success" />
+    type="success"
+  />
   <Alert message="消息提示的文案"
     description="消息提示的辅助性文字介绍消息提示的辅助性文字介绍消息提示的辅助性文字介绍"
-    type="info" />
+    type="info"
+  />
   <Alert
     message="警告提示的文案"
     description="警告提示的辅助性文字介绍警告提示的辅助性文字介绍"
-    type="warning" />
+    type="warning"
+  />
   <Alert
     message="错误提示的文案"
     description="错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍"
-    type="error" />
+    type="error"
+  />
 </div>, mountNode);
 ````
diff --git a/components/alert/demo/icon.md b/components/alert/demo/icon.md
index 94239144c5..cfb36a42cc 100644
--- a/components/alert/demo/icon.md
+++ b/components/alert/demo/icon.md
@@ -16,20 +16,24 @@ ReactDOM.render(<div>
   <Alert message="成功提示的文案"
     description="成功提示的辅助性文字介绍成功提示的辅助性文字介绍成功提示的辅助性文字介绍成功提示的辅助性文字介绍"
     type="success"
-    showIcon />
+    showIcon
+  />
   <Alert message="消息提示的文案"
     description="消息提示的辅助性文字介绍消息提示的辅助性文字介绍消息提示的辅助性文字介绍"
     type="info"
-    showIcon />
+    showIcon
+  />
   <Alert
     message="警告提示的文案"
     description="警告提示的辅助性文字介绍警告提示的辅助性文字介绍"
     type="warning"
-    showIcon />
+    showIcon
+  />
   <Alert
     message="错误提示的文案"
     description="错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍"
     type="error"
-    showIcon />
+    showIcon
+  />
 </div>, mountNode);
 ````
diff --git a/components/alert/index.jsx b/components/alert/index.jsx
index d73a84f2d7..c87fbc31e7 100644
--- a/components/alert/index.jsx
+++ b/components/alert/index.jsx
@@ -82,7 +82,8 @@ export default class Alert extends React.Component {
       <Animate component=""
         showProp="data-show"
         transitionName="slide-up"
-        onEnd={this.animationEnd}>
+        onEnd={this.animationEnd}
+      >
         <div data-show={this.state.closing} className={alertCls}>
           {showIcon ? <Icon className="ant-alert-icon" type={iconType} /> : null}
           <span className={`${prefixCls}-message`}>{message}</span>
diff --git a/components/badge/index.jsx b/components/badge/index.jsx
index dfb3ba0a78..3a84859580 100644
--- a/components/badge/index.jsx
+++ b/components/badge/index.jsx
@@ -46,11 +46,13 @@ export default class Badge extends React.Component {
         <Animate component=""
           showProp="data-show"
           transitionName={`${prefixCls}-zoom`}
-          transitionAppear>
+          transitionAppear
+        >
           {
             hidden ? null :
               <ScrollNumber data-show={!hidden} className={scrollNumberCls}
-                count={count} style={style} />
+                count={count} style={style}
+              />
           }
         </Animate>
       </span>
diff --git a/components/breadcrumb/demo/router.md b/components/breadcrumb/demo/router.md
index 1d355758f5..e99a2425dd 100644
--- a/components/breadcrumb/demo/router.md
+++ b/components/breadcrumb/demo/router.md
@@ -37,7 +37,8 @@ function Home(props) {
         marginTop: 15,
         paddingBottom: 15,
         borderBottom: '1px dashed #ccc',
-      }}>
+      }}
+      >
         点击上面的导航切换页面，面包屑在下面：
       </div>
       <Breadcrumb {...props} />
diff --git a/components/button/button.jsx b/components/button/button.jsx
index 63325af2d4..b75b54c40f 100644
--- a/components/button/button.jsx
+++ b/components/button/button.jsx
@@ -104,7 +104,8 @@ export default class Button extends React.Component {
         type={htmlType || 'button'}
         className={classes}
         onMouseUp={this.handleMouseUp}
-        onClick={this.handleClick}>
+        onClick={this.handleClick}
+      >
         {iconType ? <Icon type={iconType} /> : null}{kids}
       </button>
     );
diff --git a/components/calendar/Header.jsx b/components/calendar/Header.jsx
index 53c1728977..289ee638a6 100644
--- a/components/calendar/Header.jsx
+++ b/components/calendar/Header.jsx
@@ -45,7 +45,8 @@ export default class Header extends React.Component {
         dropdownMenuStyle={{ minWidth: 103 }}
         className={`${prefixCls}-year-select`}
         onChange={this.onYearChange}
-        value={String(year)}>
+        value={String(year)}
+      >
         {options}
       </Select>
     );
@@ -69,7 +70,8 @@ export default class Header extends React.Component {
         dropdownMatchSelectWidth={false}
         className={`${prefixCls}-month-select`}
         value={String(month)}
-        onChange={this.onMonthChange}>
+        onChange={this.onMonthChange}
+      >
         {options}
       </Select>
     );
diff --git a/components/calendar/demo/custom-render.md b/components/calendar/demo/custom-render.md
index 472e072a9d..e0470ee64c 100644
--- a/components/calendar/demo/custom-render.md
+++ b/components/calendar/demo/custom-render.md
@@ -26,6 +26,7 @@ function monthCellRender(value) {
 
 ReactDOM.render(
   <Calendar defaultValue={new Date('2010-10-10')}
-    dateCellRender={dateCellRender} monthCellRender={monthCellRender} />
+    dateCellRender={dateCellRender} monthCellRender={monthCellRender}
+  />
 , mountNode);
 ````
diff --git a/components/calendar/index.jsx b/components/calendar/index.jsx
index d7cd687fb5..b7f68eb3f5 100644
--- a/components/calendar/index.jsx
+++ b/components/calendar/index.jsx
@@ -139,7 +139,8 @@ export default class Calendar extends React.Component {
           locale={locale.lang}
           prefixCls={prefixCls}
           onTypeChange={this.setType}
-          onValueChange={this.setValue} />
+          onValueChange={this.setValue}
+        />
         <FullCalendar
           {...props}
           Select={noop}
@@ -149,7 +150,8 @@ export default class Calendar extends React.Component {
           showHeader={false}
           value={value}
           monthCellRender={this.monthCellRender}
-          dateCellRender={this.dateCellRender} />
+          dateCellRender={this.dateCellRender}
+        />
       </div>
     );
   }
diff --git a/components/card/demo/grid.md b/components/card/demo/grid.md
index 62d2ae23c2..f087fd453c 100644
--- a/components/card/demo/grid.md
+++ b/components/card/demo/grid.md
@@ -35,11 +35,11 @@ ReactDOM.render(
 
 ````css
 /* Increase grid spacing of 16px  */
-.code-box-demo .row {
+.code-box-demo .ant-row {
   margin-left: -8px;
   margin-right: -8px;
 }
-.code-box-demo .row > div {
+.code-box-demo .ant-row > div {
   padding: 0 8px;
 }
 ````
diff --git a/components/cascader/demo/custom-render.md b/components/cascader/demo/custom-render.md
index 67ea032c61..2205e03f74 100644
--- a/components/cascader/demo/custom-render.md
+++ b/components/cascader/demo/custom-render.md
@@ -56,6 +56,7 @@ ReactDOM.render(
     options={options}
     defaultValue={['zhejiang', 'hangzhou', 'xihu']}
     displayRender={displayRender}
-    style={{ width: 200 }} />
+    style={{ width: 200 }}
+  />
 , mountNode);
 ````
diff --git a/components/cascader/demo/hover.md b/components/cascader/demo/hover.md
index 659986a07f..888c07c6b9 100644
--- a/components/cascader/demo/hover.md
+++ b/components/cascader/demo/hover.md
@@ -43,6 +43,7 @@ function displayRender(label) {
 
 ReactDOM.render(
   <Cascader options={options} expandTrigger="hover"
-    displayRender={displayRender} onChange={onChange} />
+    displayRender={displayRender} onChange={onChange}
+  />
 , mountNode);
 ````
diff --git a/components/cascader/index.jsx b/components/cascader/index.jsx
index e86e66580e..fca5778849 100644
--- a/components/cascader/index.jsx
+++ b/components/cascader/index.jsx
@@ -80,7 +80,8 @@ export default class Cascader extends React.Component {
     const clearIcon = (allowClear && !disabled && this.state.value.length > 0) ?
       <Icon type="cross-circle"
         className={`${prefixCls}-picker-clear`}
-        onClick={this.clearSelection} /> : null;
+        onClick={this.clearSelection}
+      /> : null;
     const arrowCls = classNames({
       [`${prefixCls}-picker-arrow`]: true,
       [`${prefixCls}-picker-arrow-expand`]: this.state.popupVisible,
@@ -99,17 +100,20 @@ export default class Cascader extends React.Component {
         value={this.state.value}
         popupVisible={this.state.popupVisible}
         onPopupVisibleChange={this.handlePopupVisibleChange}
-        onChange={this.handleChange}>
+        onChange={this.handleChange}
+      >
         {children ||
           <span
             style={style}
-            className={pickerCls}>
+            className={pickerCls}
+          >
             <Input {...otherProps}
               placeholder={this.state.value && this.state.value.length > 0 ? null : placeholder}
               className={`${prefixCls}-input ant-input ${sizeCls}`}
               value={null}
               disabled={disabled}
-              readOnly />
+              readOnly
+            />
             <span className={`${prefixCls}-picker-label`}>{this.getLabel()}</span>
             {clearIcon}
             <Icon type="down" className={arrowCls} />
diff --git a/components/checkbox/Group.jsx b/components/checkbox/Group.jsx
index 392e7e8b2a..49089a261c 100644
--- a/components/checkbox/Group.jsx
+++ b/components/checkbox/Group.jsx
@@ -64,7 +64,8 @@ export default class CheckboxGroup extends React.Component {
             <Checkbox disabled={'disabled' in option ? option.disabled : this.props.disabled}
               checked={this.state.value.indexOf(option.value) !== -1}
               onChange={() => this.toggleOption(option)}
-              className="ant-checkbox-group-item" key={option.value}>
+              className="ant-checkbox-group-item" key={option.value}
+            >
               {option.label}
             </Checkbox>
           )
diff --git a/components/checkbox/demo/controller.md b/components/checkbox/demo/controller.md
index 19ccd6e2e6..3b650b22bf 100644
--- a/components/checkbox/demo/controller.md
+++ b/components/checkbox/demo/controller.md
@@ -22,18 +22,21 @@ const App = React.createClass({
         <p style={{ marginBottom: '20px' }}>
           <Checkbox checked={this.state.checked}
             disabled={this.state.disabled}
-            onChange={this.onChange}>
+            onChange={this.onChange}
+          >
             {label}
           </Checkbox>
         </p>
         <p>
           <Button type="primary" size="small"
-            onClick={this.toggleChecked}>
+            onClick={this.toggleChecked}
+          >
             {!this.state.checked ? '选中' : '取消'}
           </Button>
           <Button style={{ marginLeft: '10px' }}
             type="primary" size="small"
-            onClick={this.toggleDisable}>
+            onClick={this.toggleDisable}
+          >
             {!this.state.disabled ? '不可用' : '可用'}
           </Button>
         </p>
diff --git a/components/date-picker/RangePicker.jsx b/components/date-picker/RangePicker.jsx
index b2d4f5c141..f0ce8005e0 100644
--- a/components/date-picker/RangePicker.jsx
+++ b/components/date-picker/RangePicker.jsx
@@ -126,14 +126,16 @@ export default class RangePicker extends React.Component {
                   onChange={props.handleInputChange}
                   value={start ? props.getFormatter().format(start) : ''}
                   placeholder={startPlaceholder}
-                  className="ant-calendar-range-picker-input" />
+                  className="ant-calendar-range-picker-input"
+                />
                 <span className="ant-calendar-range-picker-separator"> ~ </span>
                 <input
                   disabled={disabled}
                   onChange={props.handleInputChange}
                   value={end ? props.getFormatter().format(end) : ''}
                   placeholder={endPlaceholder}
-                  className="ant-calendar-range-picker-input" />
+                  className="ant-calendar-range-picker-input"
+                />
                 <span className="ant-calendar-picker-icon" />
               </span>
             );
diff --git a/components/date-picker/createPicker.jsx b/components/date-picker/createPicker.jsx
index 71163b8daf..a80af44052 100644
--- a/components/date-picker/createPicker.jsx
+++ b/components/date-picker/createPicker.jsx
@@ -94,7 +94,8 @@ export default function createPicker(TheCalendar) {
                       onChange={props.handleInputChange}
                       value={value ? props.getFormatter().format(value) : ''}
                       placeholder={placeholder}
-                      className={props.pickerInputClass} />
+                      className={props.pickerInputClass}
+                    />
                     <span className="ant-calendar-picker-icon" />
                   </span>
                 );
diff --git a/components/date-picker/demo/start-end.md b/components/date-picker/demo/start-end.md
index 5f50ec665d..5f488460c0 100644
--- a/components/date-picker/demo/start-end.md
+++ b/components/date-picker/demo/start-end.md
@@ -45,11 +45,13 @@ const DateRange = React.createClass({
         <DatePicker disabledDate={this.disabledStartDate}
           value={this.state.startValue}
           placeholder="开始日期"
-          onChange={this.onStartChange} />
+          onChange={this.onStartChange}
+        />
         <DatePicker disabledDate={this.disabledEndDate}
           value={this.state.endValue}
           placeholder="结束日期"
-          onChange={this.onEndChange} />
+          onChange={this.onEndChange}
+        />
       </div>
     );
   },
diff --git a/components/date-picker/wrapPicker.jsx b/components/date-picker/wrapPicker.jsx
index c7dc6d5e58..63601a35d6 100644
--- a/components/date-picker/wrapPicker.jsx
+++ b/components/date-picker/wrapPicker.jsx
@@ -103,7 +103,7 @@ export default function wrapPicker(Picker, defaultFormat) {
           placeholder={locale.timePickerLocale.placeholder}
           locale={locale.timePickerLocale}
           transitionName="slide-up"
-          />
+        />
       ) : null;
 
       return (
diff --git a/components/dropdown/demo/overlay-visible.md b/components/dropdown/demo/overlay-visible.md
index 61e0a29780..42259d92f6 100644
--- a/components/dropdown/demo/overlay-visible.md
+++ b/components/dropdown/demo/overlay-visible.md
@@ -33,7 +33,8 @@ const OverlayVisible = React.createClass({
     return (
       <Dropdown overlay={menu}
         onVisibleChange={this.handleVisibleChange}
-        visible={this.state.visible}>
+        visible={this.state.visible}
+      >
         <a className="ant-dropdown-link" href="#">
           鼠标移入 <Icon type="down" />
         </a>
diff --git a/components/form/FormItem.jsx b/components/form/FormItem.jsx
index b4bfff3c24..4eacd47a60 100644
--- a/components/form/FormItem.jsx
+++ b/components/form/FormItem.jsx
@@ -33,8 +33,8 @@ export default class FormItem extends React.Component {
       return '';
     }
     const { span, offset } = colDef;
-    const col = span ? `col-${span}` : '';
-    const offsetCol = offset ? ` col-offset-${offset}` : '';
+    const col = span ? `ant-col-${span}` : '';
+    const offsetCol = offset ? ` ant-col-offset-${offset}` : '';
     return col + offsetCol;
   }
 
diff --git a/components/form/demo/advanced-search-form.md b/components/form/demo/advanced-search-form.md
index 0999e9089c..526462e04e 100644
--- a/components/form/demo/advanced-search-form.md
+++ b/components/form/demo/advanced-search-form.md
@@ -18,19 +18,22 @@ ReactDOM.render(
         <FormItem
           label="搜索名称"
           labelCol={{ span: 10 }}
-          wrapperCol={{ span: 14 }}>
+          wrapperCol={{ span: 14 }}
+        >
           <Input placeholder="请输入搜索名称" size="default" />
         </FormItem>
         <FormItem
           label="较长搜索名称"
           labelCol={{ span: 10 }}
-          wrapperCol={{ span: 14 }}>
+          wrapperCol={{ span: 14 }}
+        >
           <DatePicker size="default" />
         </FormItem>
         <FormItem
           label="搜索名称"
           labelCol={{ span: 10 }}
-          wrapperCol={{ span: 14 }}>
+          wrapperCol={{ span: 14 }}
+        >
           <Input placeholder="请输入搜索名称" size="default" />
         </FormItem>
       </Col>
@@ -38,19 +41,22 @@ ReactDOM.render(
         <FormItem
           label="搜索名称"
           labelCol={{ span: 10 }}
-          wrapperCol={{ span: 14 }}>
+          wrapperCol={{ span: 14 }}
+        >
           <Input placeholder="请输入搜索名称" size="default" />
         </FormItem>
         <FormItem
           label="较长搜索名称"
           labelCol={{ span: 10 }}
-          wrapperCol={{ span: 14 }}>
+          wrapperCol={{ span: 14 }}
+        >
           <DatePicker size="default" />
         </FormItem>
         <FormItem
           label="搜索名称"
           labelCol={{ span: 10 }}
-          wrapperCol={{ span: 14 }}>
+          wrapperCol={{ span: 14 }}
+        >
           <Input placeholder="请输入搜索名称" size="default" />
         </FormItem>
       </Col>
@@ -58,19 +64,22 @@ ReactDOM.render(
         <FormItem
           label="搜索名称"
           labelCol={{ span: 10 }}
-          wrapperCol={{ span: 14 }}>
+          wrapperCol={{ span: 14 }}
+        >
           <Input placeholder="请输入搜索名称" size="default" />
         </FormItem>
         <FormItem
           label="较长搜索名称"
           labelCol={{ span: 10 }}
-          wrapperCol={{ span: 14 }}>
+          wrapperCol={{ span: 14 }}
+        >
           <DatePicker size="default" />
         </FormItem>
         <FormItem
           label="搜索名称"
           labelCol={{ span: 10 }}
-          wrapperCol={{ span: 14 }}>
+          wrapperCol={{ span: 14 }}
+        >
           <Input placeholder="请输入搜索名称" size="default" />
         </FormItem>
       </Col>
@@ -96,7 +105,7 @@ ReactDOM.render(
 }
 
 /* 由于输入标签长度不确定，所以需要微调使之看上去居中 */
-.ant-advanced-search-form > .row {
+.ant-advanced-search-form > .ant-row {
   position: relative;
   left: -6px;
 }
diff --git a/components/form/demo/form-controls.md b/components/form/demo/form-controls.md
index a6ad4c69fc..e7ce2d2f12 100644
--- a/components/form/demo/form-controls.md
+++ b/components/form/demo/form-controls.md
@@ -23,7 +23,8 @@ ReactDOM.render(
       id="control-input"
       label="输入框"
       labelCol={{ span: 6 }}
-      wrapperCol={{ span: 14 }}>
+      wrapperCol={{ span: 14 }}
+    >
       <Input id="control-input" placeholder="Please enter..." />
     </FormItem>
 
@@ -31,7 +32,8 @@ ReactDOM.render(
       id="control-textarea"
       label="文本域"
       labelCol={{ span: 6 }}
-      wrapperCol={{ span: 14 }}>
+      wrapperCol={{ span: 14 }}
+    >
       <Input type="textarea" id="control-textarea" rows="3" />
     </FormItem>
 
@@ -39,7 +41,8 @@ ReactDOM.render(
       id="select"
       label="Select 选择器"
       labelCol={{ span: 6 }}
-      wrapperCol={{ span: 14 }}>
+      wrapperCol={{ span: 14 }}
+    >
       <Select id="select" size="large" defaultValue="lucy" style={{ width: 200 }} onChange={handleSelectChange}>
         <Option value="jack">jack</Option>
         <Option value="lucy">lucy</Option>
@@ -51,7 +54,8 @@ ReactDOM.render(
     <FormItem
       label="Checkbox 多选框"
       labelCol={{ span: 6 }}
-      wrapperCol={{ span: 18 }} >
+      wrapperCol={{ span: 18 }}
+    >
       <Checkbox className="ant-checkbox-vertical">选项一</Checkbox>
       <Checkbox className="ant-checkbox-vertical">选项二</Checkbox>
       <Checkbox className="ant-checkbox-vertical" disabled>选项三（不可选）</Checkbox>
@@ -60,7 +64,8 @@ ReactDOM.render(
     <FormItem
       label="Checkbox 多选框"
       labelCol={{ span: 6 }}
-      wrapperCol={{ span: 18 }} >
+      wrapperCol={{ span: 18 }}
+    >
       <Checkbox className="ant-checkbox-inline">选项一</Checkbox>
       <Checkbox className="ant-checkbox-inline">选项二</Checkbox>
       <Checkbox className="ant-checkbox-inline">选项三</Checkbox>
@@ -69,7 +74,8 @@ ReactDOM.render(
     <FormItem
       label="Radio 单选框"
       labelCol={{ span: 6 }}
-      wrapperCol={{ span: 18 }} >
+      wrapperCol={{ span: 18 }}
+    >
       <RadioGroup defaultValue="b">
         <Radio value="a">A</Radio>
         <Radio value="b">B</Radio>
diff --git a/components/form/demo/form-in-modal.md b/components/form/demo/form-in-modal.md
index d9ea0e5f71..57d0b0005b 100644
--- a/components/form/demo/form-in-modal.md
+++ b/components/form/demo/form-in-modal.md
@@ -42,12 +42,14 @@ let Demo = React.createClass({
           <Form horizontal form={this.props.form}>
             <FormItem
               {...formItemLayout}
-              label="用户名">
+              label="用户名"
+            >
               <Input {...getFieldProps('username', {})} type="text" autoComplete="off" />
             </FormItem>
             <FormItem
               {...formItemLayout}
-              label="密码">
+              label="密码"
+            >
               <Input {...getFieldProps('password', {})} type="password" autoComplete="off" />
             </FormItem>
           </Form>
diff --git a/components/form/demo/horizontal-form.md b/components/form/demo/horizontal-form.md
index e4f212ad20..4bfffdcd29 100644
--- a/components/form/demo/horizontal-form.md
+++ b/components/form/demo/horizontal-form.md
@@ -26,17 +26,20 @@ let Demo = React.createClass({
       <Form horizontal onSubmit={this.handleSubmit}>
         <FormItem
           {...formItemLayout}
-          label="用户名">
+          label="用户名"
+        >
           <p className="ant-form-text" id="userName" name="userName">大眼萌 minion</p>
         </FormItem>
         <FormItem
           {...formItemLayout}
-          label="密码">
+          label="密码"
+        >
           <Input type="password" {...getFieldProps('pass')} placeholder="请输入密码" />
         </FormItem>
         <FormItem
           {...formItemLayout}
-          label="您的性别">
+          label="您的性别"
+        >
           <RadioGroup {...getFieldProps('gender', { initialValue: 'female' })}>
             <Radio value="male">男的</Radio>
             <Radio value="female">女的</Radio>
@@ -45,12 +48,14 @@ let Demo = React.createClass({
         <FormItem
           {...formItemLayout}
           label="备注"
-          help="随便写点什么">
+          help="随便写点什么"
+        >
           <Input type="textarea" placeholder="随便写" {...getFieldProps('remark')} />
         </FormItem>
         <FormItem
           {...formItemLayout}
-          label={<span>卖身华府 <Tooltip title="我为秋香"><Icon type="question-circle-o" /></Tooltip></span>}>
+          label={<span>卖身华府 <Tooltip title="我为秋香"><Icon type="question-circle-o" /></Tooltip></span>}
+        >
           <Checkbox {...getFieldProps('agreement')}>同意</Checkbox>
         </FormItem>
         <FormItem wrapperCol={{ span: 16, offset: 6 }} style={{ marginTop: 24 }}>
diff --git a/components/form/demo/inline-form.md b/components/form/demo/inline-form.md
index 838662d99d..c29ec7f01d 100644
--- a/components/form/demo/inline-form.md
+++ b/components/form/demo/inline-form.md
@@ -20,14 +20,18 @@ let Demo = React.createClass({
     return (
       <Form inline onSubmit={this.handleSubmit}>
         <FormItem
-          label="账户">
+          label="账户"
+        >
           <Input placeholder="请输入账户名"
-            {...getFieldProps('userName')} />
+            {...getFieldProps('userName')}
+          />
         </FormItem>
         <FormItem
-          label="密码">
+          label="密码"
+        >
           <Input type="password" placeholder="请输入密码"
-            {...getFieldProps('password')} />
+            {...getFieldProps('password')}
+          />
         </FormItem>
         <FormItem>
           <Checkbox {...getFieldProps('agreement')}>记住我</Checkbox>
diff --git a/components/form/demo/input-group.md b/components/form/demo/input-group.md
index 06efc8fbe8..427cfcd3ed 100644
--- a/components/form/demo/input-group.md
+++ b/components/form/demo/input-group.md
@@ -16,7 +16,8 @@ ReactDOM.render(
     <FormItem
       label="标签输入框"
       labelCol={{ span: 6 }}
-      wrapperCol={{ span: 16 }}>
+      wrapperCol={{ span: 16 }}
+    >
       <Input addonBefore="Http://" defaultValue="mysite.com" id="site1" />
     </FormItem>
 
@@ -24,14 +25,16 @@ ReactDOM.render(
       label="标签输入框"
       labelCol={{ span: 6 }}
       validateStatus="success"
-      wrapperCol={{ span: 16 }}>
+      wrapperCol={{ span: 16 }}
+    >
       <Input addonBefore="Http://" addonAfter=".com" defaultValue="mysite" id="site2" />
     </FormItem>
 
     <FormItem
       label="select 标签输入框"
       labelCol={{ span: 6 }}
-      wrapperCol={{ span: 16 }}>
+      wrapperCol={{ span: 16 }}
+    >
       <InputGroup>
         <Input id="site4" placeholder="www.mysite" />
         <div className="ant-input-group-wrap">
@@ -48,7 +51,8 @@ ReactDOM.render(
     <FormItem
       label="输入身份证"
       labelCol={{ span: 6 }}
-      wrapperCol={{ span: 16 }}>
+      wrapperCol={{ span: 16 }}
+    >
       <InputGroup>
         <Col span="6">
           <Input id="certNo1" />
@@ -68,7 +72,8 @@ ReactDOM.render(
     <FormItem
       label="电话号码"
       labelCol={{ span: 6 }}
-      wrapperCol={{ span: 16 }}>
+      wrapperCol={{ span: 16 }}
+    >
       <InputGroup>
         <Col span="4">
           <Input id="tel1" defaultValue="086" />
diff --git a/components/form/demo/mix.md b/components/form/demo/mix.md
index 88bb45045b..cec75b2602 100644
--- a/components/form/demo/mix.md
+++ b/components/form/demo/mix.md
@@ -46,16 +46,19 @@ let Demo = React.createClass({
         <FormItem
           label="InputNumber 数字输入框"
           labelCol={{ span: 8 }}
-          wrapperCol={{ span: 10 }}>
+          wrapperCol={{ span: 10 }}
+        >
           <InputNumber min={1} max={10} style={{ width: 100 }}
-            {...getFieldProps('inputNumber', { initialValue: 3 })} />
+            {...getFieldProps('inputNumber', { initialValue: 3 })}
+          />
           <span className="ant-form-text"> 台机器</span>
         </FormItem>
 
         <FormItem
           label="我是标题"
           labelCol={{ span: 8 }}
-          wrapperCol={{ span: 10 }}>
+          wrapperCol={{ span: 10 }}
+        >
           <p className="ant-form-text" id="static" name="static">唧唧复唧唧木兰当户织呀</p>
           <p className="ant-form-text">
             <a href="#">链接文字</a>
@@ -66,7 +69,8 @@ let Demo = React.createClass({
           label="Switch 开关"
           labelCol={{ span: 8 }}
           wrapperCol={{ span: 10 }}
-          required>
+          required
+        >
           <Switch {...getFieldProps('switch', { valuePropName: 'checked' })} />
         </FormItem>
 
@@ -74,7 +78,8 @@ let Demo = React.createClass({
           label="Slider 滑动输入条"
           labelCol={{ span: 8 }}
           wrapperCol={{ span: 10 }}
-          required>
+          required
+        >
           <Slider marks={['A', 'B', 'C', 'D', 'E', 'F', 'G']} {...getFieldProps('slider')} />
         </FormItem>
 
@@ -82,9 +87,11 @@ let Demo = React.createClass({
           label="Select 选择器"
           labelCol={{ span: 8 }}
           wrapperCol={{ span: 16 }}
-          required>
+          required
+        >
           <Select style={{ width: 200 }}
-            {...getFieldProps('select')}>
+            {...getFieldProps('select')}
+          >
             <Option value="jack">jack</Option>
             <Option value="lucy">lucy</Option>
             <Option value="disabled" disabled>disabled</Option>
@@ -97,14 +104,16 @@ let Demo = React.createClass({
           labelCol={{ span: 8 }}
           wrapperCol={{ span: 16 }}
           required
-          hasFeedback>
+          hasFeedback
+        >
           <Cascader style={{ width: 200 }} options={areaData} {...getFieldProps('area')} />
         </FormItem>
 
         <FormItem
           label="DatePicker 日期选择框"
           labelCol={{ span: 8 }}
-          required>
+          required
+        >
           <Col span="6">
             <FormItem>
               <DatePicker {...getFieldProps('startDate')} />
@@ -125,13 +134,15 @@ let Demo = React.createClass({
           label="TimePicker 时间选择器"
           labelCol={{ span: 8 }}
           wrapperCol={{ span: 16 }}
-          required>
+          required
+        >
           <TimePicker {...getFieldProps('time')} />
         </FormItem>
 
         <FormItem
           label="选项"
-          labelCol={{ span: 8 }}>
+          labelCol={{ span: 8 }}
+        >
           <RadioGroup {...getFieldProps('rg')}>
             <RadioButton value="a">选项一</RadioButton>
             <RadioButton value="b">选项二</RadioButton>
@@ -143,7 +154,8 @@ let Demo = React.createClass({
           label="logo图"
           labelCol={{ span: 8 }}
           wrapperCol={{ span: 16 }}
-          help="提示信息要长长长长长长长长长长长长长长">
+          help="提示信息要长长长长长长长长长长长长长长"
+        >
           <Upload name="logo" action="/upload.do" listType="picture" onChange={this.handleUpload}
             {...getFieldProps('upload', {
               valuePropName: 'fileList',
diff --git a/components/form/demo/validate-basic.md b/components/form/demo/validate-basic.md
index bfde61506f..c00aea2bcf 100644
--- a/components/form/demo/validate-basic.md
+++ b/components/form/demo/validate-basic.md
@@ -114,36 +114,43 @@ let BasicDemo = React.createClass({
           {...formItemLayout}
           label="用户名"
           hasFeedback
-          help={isFieldValidating('name') ? '校验中...' : (getFieldError('name') || []).join(', ')}>
+          help={isFieldValidating('name') ? '校验中...' : (getFieldError('name') || []).join(', ')}
+        >
           <Input {...nameProps} placeholder="实时校验，输入 JasonWood 看看" />
         </FormItem>
 
         <FormItem
           {...formItemLayout}
           label="邮箱"
-          hasFeedback>
+          hasFeedback
+        >
           <Input {...emailProps} type="email" placeholder="onBlur 与 onChange 相结合" />
         </FormItem>
 
         <FormItem
           {...formItemLayout}
           label="密码"
-          hasFeedback>
+          hasFeedback
+        >
           <Input {...passwdProps} type="password" autoComplete="off"
-            onContextMenu={noop} onPaste={noop} onCopy={noop} onCut={noop} />
+            onContextMenu={noop} onPaste={noop} onCopy={noop} onCut={noop}
+          />
         </FormItem>
 
         <FormItem
           {...formItemLayout}
           label="确认密码"
-          hasFeedback>
+          hasFeedback
+        >
           <Input {...rePasswdProps} type="password" autoComplete="off" placeholder="两次输入密码保持一致"
-            onContextMenu={noop} onPaste={noop} onCopy={noop} onCut={noop} />
+            onContextMenu={noop} onPaste={noop} onCopy={noop} onCut={noop}
+          />
         </FormItem>
 
         <FormItem
           {...formItemLayout}
-          label="备注">
+          label="备注"
+        >
           <Input {...textareaProps} type="textarea" placeholder="随便写" id="textarea" name="textarea" />
         </FormItem>
 
diff --git a/components/form/demo/validate-customized.md b/components/form/demo/validate-customized.md
index 03a023d82e..051bca24d2 100644
--- a/components/form/demo/validate-customized.md
+++ b/components/form/demo/validate-customized.md
@@ -145,7 +145,8 @@ let Demo = React.createClass({
             <Col span="18">
               <FormItem
                 {...formItemLayout}
-                label="密码">
+                label="密码"
+              >
                 <Input {...passProps} type="password"
                   onContextMenu={noop} onPaste={noop} onCopy={noop} onCut={noop}
                   autoComplete="off" id="pass"
@@ -161,7 +162,8 @@ let Demo = React.createClass({
             <Col span="18">
               <FormItem
                 {...formItemLayout}
-                label="确认密码">
+                label="确认密码"
+              >
                 <Input {...rePassProps} type="password"
                   onContextMenu={noop} onPaste={noop} onCopy={noop} onCut={noop}
                   autoComplete="off" id="rePass"
diff --git a/components/form/demo/validate-other.md b/components/form/demo/validate-other.md
index 1eb0ab7784..d65c746037 100644
--- a/components/form/demo/validate-other.md
+++ b/components/form/demo/validate-other.md
@@ -110,7 +110,8 @@ let Demo = React.createClass({
       <Form horizontal form={this.props.form}>
         <FormItem
           {...formItemLayout}
-          label="国籍">
+          label="国籍"
+        >
           <Select {...selectProps} placeholder="请选择国家" style={{ width: '100%' }}>
             <Option value="china">中国</Option>
             <Option value="use">美国</Option>
@@ -122,7 +123,8 @@ let Demo = React.createClass({
 
         <FormItem
           {...formItemLayout}
-          label="喜欢的颜色">
+          label="喜欢的颜色"
+        >
           <Select {...multiSelectProps} multiple placeholder="请选择颜色" style={{ width: '100%' }}>
             <Option value="red">红色</Option>
             <Option value="orange">橙色</Option>
@@ -134,7 +136,8 @@ let Demo = React.createClass({
 
         <FormItem
           {...formItemLayout}
-          label="性别">
+          label="性别"
+        >
           <RadioGroup {...radioProps}>
             <Radio value="male">男</Radio>
             <Radio value="female">女</Radio>
@@ -144,44 +147,53 @@ let Demo = React.createClass({
 
         <FormItem
           {...formItemLayout}
-          label="兴趣爱好">
+          label="兴趣爱好"
+        >
           <Checkbox {...getFieldProps('eat', {
             valuePropName: 'checked',
-          })}>吃饭饭</Checkbox>
+          })}
+          >吃饭饭</Checkbox>
           <Checkbox {...getFieldProps('sleep', {
             valuePropName: 'checked',
-          })}>睡觉觉</Checkbox>
+          })}
+          >睡觉觉</Checkbox>
           <Checkbox {...getFieldProps('beat', {
             valuePropName: 'checked',
-          })}>打豆豆</Checkbox>
+          })}
+          >打豆豆</Checkbox>
         </FormItem>
 
         <FormItem
           {...formItemLayout}
-          label="生日">
+          label="生日"
+        >
           <DatePicker {...birthdayProps} />
         </FormItem>
 
         <FormItem
           {...formItemLayout}
-          label="选一个时间">
+          label="选一个时间"
+        >
           <TimePicker {...timeProps} />
         </FormItem>
 
         <FormItem
           {...formItemLayout}
-          label="8~12间的质数">
+          label="8~12间的质数"
+        >
           <InputNumber {...primeNumberProps} min={8} max={12} />
         </FormItem>
 
         <FormItem
           {...formItemLayout}
-          label="选择地址">
+          label="选择地址"
+        >
           <Cascader {...addressProps} options={address} />
         </FormItem>
 
         <FormItem
-          wrapperCol={{ span: 12, offset: 7 }} >
+          wrapperCol={{ span: 12, offset: 7 }}
+        >
           <Button type="primary" onClick={this.handleSubmit}>确定</Button>
           &nbsp;&nbsp;&nbsp;
           <Button type="ghost" onClick={this.handleReset}>重置</Button>
diff --git a/components/form/demo/validate-static.md b/components/form/demo/validate-static.md
index ee765aaa48..6f6775d97e 100644
--- a/components/form/demo/validate-static.md
+++ b/components/form/demo/validate-static.md
@@ -22,7 +22,8 @@ ReactDOM.render(
       labelCol={{ span: 5 }}
       wrapperCol={{ span: 12 }}
       validateStatus="error"
-      help="请输入数字和字母组合">
+      help="请输入数字和字母组合"
+    >
       <Input defaultValue="无效选择" id="error" />
     </FormItem>
 
@@ -30,7 +31,8 @@ ReactDOM.render(
       label="警告校验"
       labelCol={{ span: 5 }}
       wrapperCol={{ span: 12 }}
-      validateStatus="warning">
+      validateStatus="warning"
+    >
       <Input defaultValue="前方高能预警" id="warning" />
     </FormItem>
 
@@ -40,7 +42,8 @@ ReactDOM.render(
       wrapperCol={{ span: 12 }}
       hasFeedback
       validateStatus="validating"
-      help="信息审核中...">
+      help="信息审核中..."
+    >
       <Input defaultValue="我是被校验的内容" id="validating" />
     </FormItem>
 
@@ -49,7 +52,8 @@ ReactDOM.render(
       labelCol={{ span: 5 }}
       wrapperCol={{ span: 12 }}
       hasFeedback
-      validateStatus="success">
+      validateStatus="success"
+    >
       <Input defaultValue="我是正文" id="success" />
     </FormItem>
 
@@ -58,7 +62,8 @@ ReactDOM.render(
       labelCol={{ span: 5 }}
       wrapperCol={{ span: 12 }}
       hasFeedback
-      validateStatus="warning">
+      validateStatus="warning"
+    >
       <Input defaultValue="前方高能预警" id="warning" />
     </FormItem>
 
@@ -68,14 +73,16 @@ ReactDOM.render(
       wrapperCol={{ span: 12 }}
       hasFeedback
       validateStatus="error"
-      help="请输入数字和字母组合">
+      help="请输入数字和字母组合"
+    >
       <Input defaultValue="无效选择" id="error" />
     </FormItem>
 
     <FormItem
       label="行内校验"
       labelCol={{ span: 5 }}
-      help>
+      help
+    >
       <Col span="6">
         <FormItem validateStatus="error" help="请选择正确日期">
           <DatePicker />
diff --git a/components/input/Input.jsx b/components/input/Input.jsx
index 003768f3f4..fa9a5f0a14 100644
--- a/components/input/Input.jsx
+++ b/components/input/Input.jsx
@@ -99,12 +99,14 @@ export default class Input extends React.Component {
       case 'textarea':
         return (
           <textarea {...props} placeholder={placeholder}
-            className={inputClassName} onKeyDown={this.handleKeyDown} ref="input" />
+            className={inputClassName} onKeyDown={this.handleKeyDown} ref="input"
+          />
         );
       default:
         return (
           <input {...props} placeholder={placeholder}
-            className={inputClassName} onKeyDown={this.handleKeyDown} ref="input" />
+            className={inputClassName} onKeyDown={this.handleKeyDown} ref="input"
+          />
         );
     }
   }
diff --git a/components/input/demo/search-input.md b/components/input/demo/search-input.md
index 60e790eb9b..45ce34fdc5 100644
--- a/components/input/demo/search-input.md
+++ b/components/input/demo/search-input.md
@@ -46,7 +46,8 @@ const SearchInput = React.createClass({
       <div className="ant-search-input-wrapper" style={style}>
         <InputGroup className={searchCls}>
           <Input {...restProps} value={this.state.value} onChange={this.handleInputChange}
-            onFocus={this.handleFocusBlur} onBlur={this.handleFocusBlur} onPressEnter={this.handleSearch} />
+            onFocus={this.handleFocusBlur} onBlur={this.handleFocusBlur} onPressEnter={this.handleSearch}
+          />
           <div className="ant-input-group-wrap">
             <Button icon="search" className={btnCls} size={size} onClick={this.handleSearch} />
           </div>
@@ -58,6 +59,7 @@ const SearchInput = React.createClass({
 
 ReactDOM.render(
   <SearchInput placeholder="input search text"
-    onSearch={value => console.log(value)} style={{ width: 200 }} />
+    onSearch={value => console.log(value)} style={{ width: 200 }}
+  />
 , mountNode);
 ````
diff --git a/components/layout/col.jsx b/components/layout/col.jsx
index 19fa5a5024..7b42e5388a 100644
--- a/components/layout/col.jsx
+++ b/components/layout/col.jsx
@@ -16,19 +16,19 @@ export default function Col(props) {
     }
     sizeClassObj = {
       ...sizeClassObj,
-      [`col-${size}-${sizeProps.span}`]: sizeProps.span !== undefined,
-      [`col-${size}-order-${sizeProps.order}`]: sizeProps.order,
-      [`col-${size}-offset-${sizeProps.offset}`]: sizeProps.offset,
-      [`col-${size}-push-${sizeProps.push}`]: sizeProps.push,
-      [`col-${size}-pull-${sizeProps.pull}`]: sizeProps.pull,
+      [`ant-col-${size}-${sizeProps.span}`]: sizeProps.span !== undefined,
+      [`ant-col-${size}-order-${sizeProps.order}`]: sizeProps.order,
+      [`ant-col-${size}-offset-${sizeProps.offset}`]: sizeProps.offset,
+      [`ant-col-${size}-push-${sizeProps.push}`]: sizeProps.push,
+      [`ant-col-${size}-pull-${sizeProps.pull}`]: sizeProps.pull,
     };
   });
   const classes = classNames({
-    [`col-${span}`]: span !== undefined,
-    [`col-order-${order}`]: order,
-    [`col-offset-${offset}`]: offset,
-    [`col-push-${push}`]: push,
-    [`col-pull-${pull}`]: pull,
+    [`ant-col-${span}`]: span !== undefined,
+    [`ant-col-order-${order}`]: order,
+    [`ant-col-offset-${offset}`]: offset,
+    [`ant-col-push-${push}`]: push,
+    [`ant-col-pull-${pull}`]: pull,
     [className]: !!className,
     ...sizeClassObj,
   });
diff --git a/components/layout/demo/basic.md b/components/layout/demo/basic.md
index 570ac4f64d..2dd4322a61 100644
--- a/components/layout/demo/basic.md
+++ b/components/layout/demo/basic.md
@@ -13,19 +13,19 @@ import { Row, Col } from 'antd';
 ReactDOM.render(
   <div>
     <Row>
-      <Col span={12}>.col-12</Col>
-      <Col span={12}>.col-12</Col>
+      <Col span={12}>.ant-col-12</Col>
+      <Col span={12}>.ant-col-12</Col>
     </Row>
     <Row>
-      <Col span={8}>.col-8</Col>
-      <Col span={8}>.col-8</Col>
-      <Col span={8}>.col-8</Col>
+      <Col span={8}>.ant-col-8</Col>
+      <Col span={8}>.ant-col-8</Col>
+      <Col span={8}>.ant-col-8</Col>
     </Row>
     <Row>
-      <Col span={6}>.col-6</Col>
-      <Col span={6}>.col-6</Col>
-      <Col span={6}>.col-6</Col>
-      <Col span={6}>.col-6</Col>
+      <Col span={6}>.ant-col-6</Col>
+      <Col span={6}>.ant-col-6</Col>
+      <Col span={6}>.ant-col-6</Col>
+      <Col span={6}>.ant-col-6</Col>
     </Row>
   </div>,
   mountNode
diff --git a/components/layout/demo/flex-align.md b/components/layout/demo/flex-align.md
index b7835e6b75..2654b31573 100644
--- a/components/layout/demo/flex-align.md
+++ b/components/layout/demo/flex-align.md
@@ -14,26 +14,26 @@ ReactDOM.render(
   <div>
     <p>顶部对齐</p>
     <Row type="flex" justify="center" align="top">
-      <Col span={4}><DemoBox value={100}>.col-4</DemoBox></Col>
-      <Col span={4}><DemoBox value={50}>.col-4</DemoBox></Col>
-      <Col span={4}><DemoBox value={120}>.col-4</DemoBox></Col>
-      <Col span={4}><DemoBox value={80}>.col-4</DemoBox></Col>
+      <Col span={4}><DemoBox value={100}>.ant-col-4</DemoBox></Col>
+      <Col span={4}><DemoBox value={50}>.ant-col-4</DemoBox></Col>
+      <Col span={4}><DemoBox value={120}>.ant-col-4</DemoBox></Col>
+      <Col span={4}><DemoBox value={80}>.ant-col-4</DemoBox></Col>
     </Row>
 
     <p>居中对齐</p>
     <Row type="flex" justify="space-around" align="middle">
-      <Col span={4}><DemoBox value={100}>.col-4</DemoBox></Col>
-      <Col span={4}><DemoBox value={50}>.col-4</DemoBox></Col>
-      <Col span={4}><DemoBox value={120}>.col-4</DemoBox></Col>
-      <Col span={4}><DemoBox value={80}>.col-4</DemoBox></Col>
+      <Col span={4}><DemoBox value={100}>.ant-col-4</DemoBox></Col>
+      <Col span={4}><DemoBox value={50}>.ant-col-4</DemoBox></Col>
+      <Col span={4}><DemoBox value={120}>.ant-col-4</DemoBox></Col>
+      <Col span={4}><DemoBox value={80}>.ant-col-4</DemoBox></Col>
     </Row>
 
     <p>底部对齐</p>
     <Row type="flex" justify="space-between" align="bottom">
-      <Col span={4}><DemoBox value={100}>.col-4</DemoBox></Col>
-      <Col span={4}><DemoBox value={50}>.col-4</DemoBox></Col>
-      <Col span={4}><DemoBox value={120}>.col-4</DemoBox></Col>
-      <Col span={4}><DemoBox value={80}>.col-4</DemoBox></Col>
+      <Col span={4}><DemoBox value={100}>.ant-col-4</DemoBox></Col>
+      <Col span={4}><DemoBox value={50}>.ant-col-4</DemoBox></Col>
+      <Col span={4}><DemoBox value={120}>.ant-col-4</DemoBox></Col>
+      <Col span={4}><DemoBox value={80}>.ant-col-4</DemoBox></Col>
     </Row>
   </div>,
   mountNode
diff --git a/components/layout/demo/flex.md b/components/layout/demo/flex.md
index 34e9b550af..a5463a8e98 100644
--- a/components/layout/demo/flex.md
+++ b/components/layout/demo/flex.md
@@ -14,42 +14,42 @@ ReactDOM.render(
   <div>
     <p>子元素居左排列</p>
     <Row type="flex" justify="start">
-      <Col span={4}>.col-4</Col>
-      <Col span={4}>.col-4</Col>
-      <Col span={4}>.col-4</Col>
-      <Col span={4}>.col-4</Col>
+      <Col span={4}>.ant-col-4</Col>
+      <Col span={4}>.ant-col-4</Col>
+      <Col span={4}>.ant-col-4</Col>
+      <Col span={4}>.ant-col-4</Col>
     </Row>
 
     <p>子元素居中排列</p>
     <Row type="flex" justify="center">
-      <Col span={4}>.col-4</Col>
-      <Col span={4}>.col-4</Col>
-      <Col span={4}>.col-4</Col>
-      <Col span={4}>.col-4</Col>
+      <Col span={4}>.ant-col-4</Col>
+      <Col span={4}>.ant-col-4</Col>
+      <Col span={4}>.ant-col-4</Col>
+      <Col span={4}>.ant-col-4</Col>
     </Row>
 
     <p>子元素居右排列</p>
     <Row type="flex" justify="end">
-      <Col span={4}>.col-4</Col>
-      <Col span={4}>.col-4</Col>
-      <Col span={4}>.col-4</Col>
-      <Col span={4}>.col-4</Col>
+      <Col span={4}>.ant-col-4</Col>
+      <Col span={4}>.ant-col-4</Col>
+      <Col span={4}>.ant-col-4</Col>
+      <Col span={4}>.ant-col-4</Col>
     </Row>
 
     <p>子元素等宽排列</p>
     <Row type="flex" justify="space-between">
-      <Col span={4}>.col-4</Col>
-      <Col span={4}>.col-4</Col>
-      <Col span={4}>.col-4</Col>
-      <Col span={4}>.col-4</Col>
+      <Col span={4}>.ant-col-4</Col>
+      <Col span={4}>.ant-col-4</Col>
+      <Col span={4}>.ant-col-4</Col>
+      <Col span={4}>.ant-col-4</Col>
     </Row>
 
     <p>子元素分散对齐</p>
     <Row type="flex" justify="space-around">
-      <Col span={4}>.col-4</Col>
-      <Col span={4}>.col-4</Col>
-      <Col span={4}>.col-4</Col>
-      <Col span={4}>.col-4</Col>
+      <Col span={4}>.ant-col-4</Col>
+      <Col span={4}>.ant-col-4</Col>
+      <Col span={4}>.ant-col-4</Col>
+      <Col span={4}>.ant-col-4</Col>
     </Row>
   </div>,
   mountNode
diff --git a/components/layout/demo/gutter.md b/components/layout/demo/gutter.md
index 62da3478b7..dbd472936c 100644
--- a/components/layout/demo/gutter.md
+++ b/components/layout/demo/gutter.md
@@ -12,16 +12,16 @@ ReactDOM.render(
   <div className="gutter-example">
     <Row gutter={16}>
       <Col className="gutter-row" span={6}>
-        <div className="gutter-box">.col-6</div>
+        <div className="gutter-box">.ant-col-6</div>
       </Col>
       <Col className="gutter-row" span={6}>
-        <div className="gutter-box">.col-6</div>
+        <div className="gutter-box">.ant-col-6</div>
       </Col>
       <Col className="gutter-row" span={6}>
-        <div className="gutter-box">.col-6</div>
+        <div className="gutter-box">.ant-col-6</div>
       </Col>
       <Col className="gutter-row" span={6}>
-        <div className="gutter-box">.col-6</div>
+        <div className="gutter-box">.ant-col-6</div>
       </Col>
     </Row>
   </div>
@@ -29,7 +29,7 @@ ReactDOM.render(
 ````
 
 ````css
-.gutter-example .row > div {
+.gutter-example .ant-row > div {
   background: transparent;
   border: 0;
 }
diff --git a/components/layout/demo/offset.md b/components/layout/demo/offset.md
index 9f04e0b0d7..7234b09a51 100644
--- a/components/layout/demo/offset.md
+++ b/components/layout/demo/offset.md
@@ -13,15 +13,15 @@ import { Row, Col } from 'antd';
 ReactDOM.render(
   <div>
     <Row>
-      <Col span={8}>.col-8</Col>
-      <Col span={8} offset={8}>.col-8</Col>
+      <Col span={8}>.ant-col-8</Col>
+      <Col span={8} offset={8}>.ant-col-8</Col>
     </Row>
     <Row>
-      <Col span={6} offset={6}>.col-6 .col-offset-6</Col>
-      <Col span={6} offset={6}>.col-6 .col-offset-6</Col>
+      <Col span={6} offset={6}>.ant-col-6 .ant-col-offset-6</Col>
+      <Col span={6} offset={6}>.ant-col-6 .ant-col-offset-6</Col>
     </Row>
     <Row>
-      <Col span={12} offset={6}>.col-12 .col-offset-6</Col>
+      <Col span={12} offset={6}>.ant-col-12 .ant-col-offset-6</Col>
     </Row>
   </div>,
   mountNode
diff --git a/components/layout/demo/sort.md b/components/layout/demo/sort.md
index 7e3a01480b..c7be08ec6a 100644
--- a/components/layout/demo/sort.md
+++ b/components/layout/demo/sort.md
@@ -13,8 +13,8 @@ import { Row, Col } from 'antd';
 ReactDOM.render(
   <div>
     <Row>
-      <Col span={18} push={6}>.col-18 .col-push-6</Col>
-      <Col span={6} pull={18}>.col-6 .col-pull-18</Col>
+      <Col span={18} push={6}>.ant-col-18 .ant-col-push-6</Col>
+      <Col span={6} pull={18}>.ant-col-6 .ant-col-pull-18</Col>
     </Row>
   </div>,
   mountNode
diff --git a/components/layout/index.md b/components/layout/index.md
index 96677cf43b..88f92c9049 100644
--- a/components/layout/index.md
+++ b/components/layout/index.md
@@ -11,49 +11,49 @@ english: Layout
 ## 设计理念
 
 <div class="layout-demo">
-<div class="row demo-row">
-  <div class="col-24 demo-col demo-col-1">
+<div class="ant-row demo-row">
+  <div class="ant-col-24 demo-col demo-col-1">
     100%
   </div>
 </div>
-<div class="row demo-row">
-  <div class="col-6 demo-col demo-col-2">
+<div class="ant-row demo-row">
+  <div class="ant-col-6 demo-col demo-col-2">
     25%
   </div>
-  <div class="col-6 demo-col demo-col-3">
+  <div class="ant-col-6 demo-col demo-col-3">
     25%
   </div>
-  <div class="col-6 demo-col demo-col-2">
+  <div class="ant-col-6 demo-col demo-col-2">
     25%
   </div>
-  <div class="col-6 demo-col demo-col-3">
+  <div class="ant-col-6 demo-col demo-col-3">
     25%
   </div>
 </div>
-<div class="row demo-row">
-  <div class="col-8 demo-col demo-col-4">
+<div class="ant-row demo-row">
+  <div class="ant-col-8 demo-col demo-col-4">
     33.33%
   </div>
-  <div class="col-8 demo-col demo-col-5">
+  <div class="ant-col-8 demo-col demo-col-5">
     33.33%
   </div>
-  <div class="col-8 demo-col demo-col-4">
+  <div class="ant-col-8 demo-col demo-col-4">
     33.33%
   </div>
 </div>
-<div class="row demo-row">
-  <div class="col-12 demo-col demo-col-1">
+<div class="ant-row demo-row">
+  <div class="ant-col-12 demo-col demo-col-1">
     50%
   </div>
-  <div class="col-12 demo-col demo-col-3">
+  <div class="ant-col-12 demo-col demo-col-3">
     50%
   </div>
 </div>
-<div class="row demo-row">
-  <div class="col-16 demo-col demo-col-4">
+<div class="ant-row demo-row">
+  <div class="ant-col-16 demo-col demo-col-4">
     66.66%
   </div>
-  <div class="col-8 demo-col demo-col-5">
+  <div class="ant-col-8 demo-col demo-col-5">
     33.33%
   </div>
 </div>
@@ -69,7 +69,7 @@ english: Layout
 
 * 通过`row`在水平方向建立一组`column`（简写col）
 * 你的内容应当放置于`col`内，并且，只有`col`可以作为`row`的直接元素
-* 栅格系统中的列是指1到24的值来表示其跨越的范围。例如，三个等宽的列可以使用`.col-8`来创建
+* 栅格系统中的列是指1到24的值来表示其跨越的范围。例如，三个等宽的列可以使用`.ant-col-8`来创建
 * 如果一个`row`中的`col`总和超过 24，那么多余的`col`会作为一个整体另起一行排列
 
 ## Flex 布局
diff --git a/components/layout/row.jsx b/components/layout/row.jsx
index 54dd0c7245..a7f93b0357 100644
--- a/components/layout/row.jsx
+++ b/components/layout/row.jsx
@@ -16,10 +16,10 @@ export default class Row extends React.Component {
   render() {
     const { type, justify, align, className, gutter, style, children, ...others } = this.props;
     const classes = classNames({
-      row: !type,
-      [`row-${type}`]: type,
-      [`row-${type}-${justify}`]: justify,
-      [`row-${type}-${align}`]: align,
+      'ant-row': !type,
+      [`ant-row-${type}`]: type,
+      [`ant-row-${type}-${justify}`]: justify,
+      [`ant-row-${type}-${align}`]: align,
       [className]: className,
     });
     const rowStyle = gutter > 0 ? {
diff --git a/components/layout/style/index.less b/components/layout/style/index.less
index 1cea82b039..0b105d50c4 100644
--- a/components/layout/style/index.less
+++ b/components/layout/style/index.less
@@ -3,12 +3,12 @@
 @import "./mixin";
 
 // Grid system
-.row {
+.ant-row {
   .make-row();
   display: block;
 }
 
-.row-flex {
+.ant-row-flex {
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
@@ -20,46 +20,46 @@
 }
 
 // x轴原点
-.row-flex-start {
+.ant-row-flex-start {
   justify-content: flex-start;
 }
 
 // x轴居中
-.row-flex-center {
+.ant-row-flex-center {
   justify-content: center;
 }
 
 // x轴反方向
-.row-flex-end {
+.ant-row-flex-end {
   justify-content: flex-end;
 }
 
 // x轴平分
-.row-flex-space-between {
+.ant-row-flex-space-between {
   justify-content: space-between;
 }
 
 // x轴有间隔地平分
-.row-flex-space-around {
+.ant-row-flex-space-around {
   justify-content: space-around;
 }
 
 // 顶部对齐
-.row-flex-top {
+.ant-row-flex-top {
   align-items: flex-start;
 }
 
 // 居中对齐
-.row-flex-middle {
+.ant-row-flex-middle {
   align-items: center;
 }
 
 // 底部对齐
-.row-flex-bottom {
+.ant-row-flex-bottom {
   align-items: flex-end;
 }
 
-.col {
+.ant-col {
   position: relative;
   display: block;
 }
diff --git a/components/layout/style/mixin.less b/components/layout/style/mixin.less
index 1ce82101e1..d238ad7b8c 100644
--- a/components/layout/style/mixin.less
+++ b/components/layout/style/mixin.less
@@ -12,11 +12,11 @@
 
 .make-grid-columns() {
   .col(@index) {
-    @item: ~".col-@{index}, .col-xs-@{index}, .col-sm-@{index}, .col-md-@{index}, .col-lg-@{index}";
+    @item: ~".ant-col-@{index}, .ant-col-xs-@{index}, .ant-col-sm-@{index}, .ant-col-md-@{index}, .ant-col-lg-@{index}";
     .col((@index + 1), @item);
   }
   .col(@index, @list) when (@index =< @grid-columns) {
-    @item: ~".col-@{index}, .col-xs-@{index}, .col-sm-@{index}, .col-md-@{index}, .col-lg-@{index}";
+    @item: ~".ant-col-@{index}, .ant-col-xs-@{index}, .ant-col-sm-@{index}, .ant-col-md-@{index}, .ant-col-lg-@{index}";
     .col((@index + 1), ~"@{list}, @{item}");
   }
   .col(@index, @list) when (@index > @grid-columns) {
@@ -33,11 +33,11 @@
 
 .float-grid-columns(@class) {
   .col(@index) { // initial
-    @item: ~".col@{class}-@{index}";
+    @item: ~".ant-col@{class}-@{index}";
     .col((@index + 1), @item);
   }
   .col(@index, @list) when (@index =< @grid-columns) { // general
-    @item: ~".col@{class}-@{index}";
+    @item: ~".ant-col@{class}-@{index}";
     .col((@index + 1), ~"@{list}, @{item}");
   }
   .col(@index, @list) when (@index > @grid-columns) { // terminal
@@ -51,33 +51,33 @@
 
 // lesshint false
 .loop-grid-columns(@index, @class) when (@index > 0) {
-  .col@{class}-@{index} {
+  .ant-col@{class}-@{index} {
     display: block;
     width: percentage((@index / @grid-columns));
   }
-  .col@{class}-push-@{index} {
+  .ant-col@{class}-push-@{index} {
     left: percentage((@index / @grid-columns));
   }
-  .col@{class}-pull-@{index} {
+  .ant-col@{class}-pull-@{index} {
     right: percentage((@index / @grid-columns));
   }
-  .col@{class}-offset-@{index} {
+  .ant-col@{class}-offset-@{index} {
     margin-left: percentage((@index / @grid-columns));
   }
-  .col@{class}-order-@{index} {
+  .ant-col@{class}-order-@{index} {
     order: @index;
   }
   .loop-grid-columns((@index - 1), @class);
 }
 
 .loop-grid-columns(@index, @class) when (@index = 0) {
-  .col@{class}-@{index} {
+  .ant-col@{class}-@{index} {
     display: none;
   }
-  .col-push-@{index} {
+  .ant-col-push-@{index} {
     left: auto;
   }
-  .col-pull-@{index} {
+  .ant-col-pull-@{index} {
     right: auto;
   }
 }
diff --git a/components/locale-provider/demo/all.md b/components/locale-provider/demo/all.md
index 22bb973090..39114fc464 100644
--- a/components/locale-provider/demo/all.md
+++ b/components/locale-provider/demo/all.md
@@ -77,7 +77,8 @@ const Page = React.createClass({
             showSearch
             titles={['', '']}
             targetKeys={[]}
-            render={item => item.title} />
+            render={item => item.title}
+          />
         </div>
         <div style={{ width: 290, border: '1px solid #d9d9d9', borderRadius: 4 }}>
           <Calendar fullscreen={false} />
diff --git a/components/menu/demo/horizontal.md b/components/menu/demo/horizontal.md
index a49da4c031..41c246f8f2 100644
--- a/components/menu/demo/horizontal.md
+++ b/components/menu/demo/horizontal.md
@@ -26,7 +26,8 @@ const App = React.createClass({
     return (
       <Menu onClick={this.handleClick}
         selectedKeys={[this.state.current]}
-        mode="horizontal">
+        mode="horizontal"
+      >
         <Menu.Item key="mail">
           <Icon type="mail" />导航一
         </Menu.Item>
diff --git a/components/menu/demo/sider-current.md b/components/menu/demo/sider-current.md
index 1013e711c6..21d03aca97 100644
--- a/components/menu/demo/sider-current.md
+++ b/components/menu/demo/sider-current.md
@@ -36,7 +36,8 @@ const Sider = React.createClass({
         onOpen={this.onToggle}
         onClose={this.onToggle}
         selectedKeys={[this.state.current]}
-        mode="inline">
+        mode="inline"
+      >
         <SubMenu key="sub1" title={<span><Icon type="mail" /><span>导航一</span></span>}>
           <Menu.Item key="1">选项1</Menu.Item>
           <Menu.Item key="2">选项2</Menu.Item>
diff --git a/components/menu/demo/sider.md b/components/menu/demo/sider.md
index 55682277ee..326a0ec252 100644
--- a/components/menu/demo/sider.md
+++ b/components/menu/demo/sider.md
@@ -28,7 +28,8 @@ const Sider = React.createClass({
         style={{ width: 240 }}
         defaultOpenKeys={['sub1']}
         selectedKeys={[this.state.current]}
-        mode="inline">
+        mode="inline"
+      >
         <SubMenu key="sub1" title={<span><Icon type="mail" /><span>导航一</span></span>}>
           <MenuItemGroup title="分组1">
             <Menu.Item key="1">选项1</Menu.Item>
diff --git a/components/menu/demo/switch-mode.md b/components/menu/demo/switch-mode.md
index 33bc898f6c..ad49a9d803 100644
--- a/components/menu/demo/switch-mode.md
+++ b/components/menu/demo/switch-mode.md
@@ -30,7 +30,8 @@ const Sider = React.createClass({
         <Menu
           style={{ width: 240 }}
           defaultOpenKeys={['sub1']}
-          mode={this.state.mode}>
+          mode={this.state.mode}
+        >
           <SubMenu key="sub1" title={<span><Icon type="mail" /><span>导航一</span></span>}>
             <MenuItemGroup title="分组1">
               <Menu.Item key="1">选项1</Menu.Item>
diff --git a/components/menu/demo/theme.md b/components/menu/demo/theme.md
index 3e125016f2..63abee71a7 100644
--- a/components/menu/demo/theme.md
+++ b/components/menu/demo/theme.md
@@ -37,7 +37,8 @@ const Sider = React.createClass({
           style={{ width: 240 }}
           defaultOpenKeys={['sub1']}
           selectedKeys={[this.state.current]}
-          mode="inline">
+          mode="inline"
+        >
           <SubMenu key="sub1" title={<span><Icon type="mail" /><span>导航一</span></span>}>
             <Menu.Item key="1">选项1</Menu.Item>
             <Menu.Item key="2">选项2</Menu.Item>
diff --git a/components/modal/Modal.jsx b/components/modal/Modal.jsx
index 39e5b16ab8..6b8742ae30 100644
--- a/components/modal/Modal.jsx
+++ b/components/modal/Modal.jsx
@@ -78,21 +78,24 @@ export default class Modal extends React.Component {
       <Button key="cancel"
         type="ghost"
         size="large"
-        onClick={this.handleCancel}>
+        onClick={this.handleCancel}
+      >
         {cancelText || '取消'}
       </Button>,
       <Button key="confirm"
         type="primary"
         size="large"
         loading={props.confirmLoading}
-        onClick={this.handleOk}>
+        onClick={this.handleOk}
+      >
         {okText || '确定'}
       </Button>,
     ];
     let footer = props.footer || defaultFooter;
     return (
       <Dialog onClose={this.handleCancel} footer={footer} {...props}
-        visible={props.visible} mousePosition={mousePosition} />
+        visible={props.visible} mousePosition={mousePosition}
+      />
     );
   }
 }
diff --git a/components/modal/confirm.jsx b/components/modal/confirm.jsx
index 295257a9b8..f37d4d35fb 100644
--- a/components/modal/confirm.jsx
+++ b/components/modal/confirm.jsx
@@ -122,7 +122,8 @@ export default function confirm(config) {
       footer=""
       maskTransitionName="fade"
       style={style}
-      width={width}>
+      width={width}
+    >
       <div style={{ zoom: 1, overflow: 'hidden' }}>{body} {footer}</div>
     </Dialog>
   , div, function () {
diff --git a/components/modal/demo/async.md b/components/modal/demo/async.md
index e51af392b8..40324990f9 100644
--- a/components/modal/demo/async.md
+++ b/components/modal/demo/async.md
@@ -46,7 +46,8 @@ const Test = React.createClass({
           visible={this.state.visible}
           onOk={this.handleOk}
           confirmLoading={this.state.confirmLoading}
-          onCancel={this.handleCancel}>
+          onCancel={this.handleCancel}
+        >
           <p>{this.state.ModalText}</p>
         </Modal>
       </div>
diff --git a/components/modal/demo/basic.md b/components/modal/demo/basic.md
index 15ef92c0ef..99f4c97055 100644
--- a/components/modal/demo/basic.md
+++ b/components/modal/demo/basic.md
@@ -34,7 +34,8 @@ const App = React.createClass({
       <div>
         <Button type="primary" onClick={this.showModal}>显示对话框</Button>
         <Modal title="第一个 Modal" visible={this.state.visible}
-          onOk={this.handleOk} onCancel={this.handleCancel}>
+          onOk={this.handleOk} onCancel={this.handleCancel}
+        >
           <p>对话框的内容</p>
           <p>对话框的内容</p>
           <p>对话框的内容</p>
diff --git a/components/modal/demo/footer.md b/components/modal/demo/footer.md
index 14b7bfda0e..dbfaa0f56c 100644
--- a/components/modal/demo/footer.md
+++ b/components/modal/demo/footer.md
@@ -43,7 +43,8 @@ const Test = React.createClass({
             <Button key="submit" type="primary" size="large" loading={this.state.loading} onClick={this.handleOk}>
               提 交
             </Button>,
-          ]}>
+          ]}
+        >
           <p>对话框的内容</p>
           <p>对话框的内容</p>
           <p>对话框的内容</p>
diff --git a/components/modal/demo/locale.md b/components/modal/demo/locale.md
index c81bd59a7e..36800582cb 100644
--- a/components/modal/demo/locale.md
+++ b/components/modal/demo/locale.md
@@ -33,7 +33,8 @@ const LocalizedModal = React.createClass({
         <Button type="primary" onClick={this.showModal}>Show Modal</Button>
         <Modal title="Modal" visible={this.state.visible}
           onOk={this.handleOk} onCancel={this.handleCancel}
-          okText="OK" cancelText="Cancel">
+          okText="OK" cancelText="Cancel"
+        >
           <p>Bla bla ...</p>
           <p>Bla bla ...</p>
           <p>Bla bla ...</p>
diff --git a/components/modal/demo/position.md b/components/modal/demo/position.md
index b46d015090..b3387757c3 100644
--- a/components/modal/demo/position.md
+++ b/components/modal/demo/position.md
@@ -30,7 +30,8 @@ const App = React.createClass({
           style={{ top: 20 }}
           visible={this.state.modal1Visible}
           onOk={() => this.setModal1Visible(false)}
-          onCancel={() => this.setModal1Visible(false)}>
+          onCancel={() => this.setModal1Visible(false)}
+        >
           <p>对话框的内容</p>
           <p>对话框的内容</p>
           <p>对话框的内容</p>
@@ -41,7 +42,8 @@ const App = React.createClass({
           wrapClassName="vertical-center-modal"
           visible={this.state.modal2Visible}
           onOk={() => this.setModal2Visible(false)}
-          onCancel={() => this.setModal2Visible(false)}>
+          onCancel={() => this.setModal2Visible(false)}
+        >
           <p>对话框的内容</p>
           <p>对话框的内容</p>
           <p>对话框的内容</p>
diff --git a/components/pagination/Pagination.jsx b/components/pagination/Pagination.jsx
index f26e9815f2..1d2470d3a5 100644
--- a/components/pagination/Pagination.jsx
+++ b/components/pagination/Pagination.jsx
@@ -36,7 +36,8 @@ export default class Pagination extends React.Component {
         selectPrefixCls="ant-select"
         {...this.props}
         locale={locale}
-        className={className} />
+        className={className}
+      />
     );
   }
 }
diff --git a/components/pagination/demo/total.md b/components/pagination/demo/total.md
index c3c2ee8e51..82ec3d2bb9 100644
--- a/components/pagination/demo/total.md
+++ b/components/pagination/demo/total.md
@@ -13,7 +13,8 @@ ReactDOM.render(
     selectComponentClass={Select}
     total={80}
     showTotal={total => `共 ${total} 条`}
-    pageSize={20} defaultCurrent={1} />,
+    pageSize={20} defaultCurrent={1}
+  />,
   mountNode
 );
 ````
diff --git a/components/popconfirm/demo/dynamic-trigger.md b/components/popconfirm/demo/dynamic-trigger.md
index dfd185ad33..a5770b77f8 100644
--- a/components/popconfirm/demo/dynamic-trigger.md
+++ b/components/popconfirm/demo/dynamic-trigger.md
@@ -44,7 +44,8 @@ let App = React.createClass({
       <div>
         <Popconfirm title="确定要删除这个任务吗？"
           visible={this.state.visible} onVisibleChange={this.handleVisibleChange}
-          onConfirm={this.confirm} onCancel={this.cancel}>
+          onConfirm={this.confirm} onCancel={this.cancel}
+        >
           <a href="#">删除某任务</a>
         </Popconfirm>
         <br />
diff --git a/components/popconfirm/index.jsx b/components/popconfirm/index.jsx
index 95b66c172a..abd00b6250 100644
--- a/components/popconfirm/index.jsx
+++ b/components/popconfirm/index.jsx
@@ -89,7 +89,8 @@ export default class Popconfirm extends React.Component {
         transitionName={this.props.transitionName}
         visible={this.state.visible}
         trigger={trigger}
-        overlay={overlay}>
+        overlay={overlay}
+      >
         {this.props.children}
       </Tooltip>
     );
diff --git a/components/popover/demo/control.md b/components/popover/demo/control.md
index e9aaab40c9..d25e85f5b4 100644
--- a/components/popover/demo/control.md
+++ b/components/popover/demo/control.md
@@ -30,7 +30,8 @@ const App = React.createClass({
     );
     return (
       <Popover content={content} title="标题" trigger="click"
-        visible={this.state.visible} onVisibleChange={this.handleVisibleChange}>
+        visible={this.state.visible} onVisibleChange={this.handleVisibleChange}
+      >
         <Button type="primary">点击弹出卡片</Button>
       </Popover>
     );
diff --git a/components/popover/index.jsx b/components/popover/index.jsx
index cd79327ab9..9c70a65530 100644
--- a/components/popover/index.jsx
+++ b/components/popover/index.jsx
@@ -22,7 +22,8 @@ export default class Popover extends React.Component {
         builtinPlacements={placements}
         ref="tooltip"
         {...this.props}
-        overlay={this.getOverlay()}>
+        overlay={this.getOverlay()}
+      >
         {this.props.children}
       </Tooltip>
     );
diff --git a/components/progress/progress.jsx b/components/progress/progress.jsx
index f7adf5b524..93f2ea0ef0 100644
--- a/components/progress/progress.jsx
+++ b/components/progress/progress.jsx
@@ -76,7 +76,8 @@ export default class Line extends React.Component {
       progress = (
         <div className={`${prefixCls}-inner`} style={circleStyle}>
           <Circle percent={percent} strokeWidth={strokeWidth || 6}
-            strokeColor={statusColorMap[progressStatus]} trailColor={trailColor} />
+            strokeColor={statusColorMap[progressStatus]} trailColor={trailColor}
+          />
           {progressInfo}
         </div>
       );
diff --git a/components/queue-anim/demo/custom.md b/components/queue-anim/demo/custom.md
index dd2639e39e..a005f68d1e 100644
--- a/components/queue-anim/demo/custom.md
+++ b/components/queue-anim/demo/custom.md
@@ -48,7 +48,8 @@ const Test = React.createClass({
           animConfig={[
             { opacity: [1, 0], translateY: [0, 50] },
             { opacity: [1, 0], translateY: [0, -50] },
-          ]}>
+          ]}
+        >
           {list}
         </QueueAnim>
       </div>
diff --git a/components/queue-anim/demo/enter-leave.md b/components/queue-anim/demo/enter-leave.md
index 3b69e132e7..91aadb5b78 100644
--- a/components/queue-anim/demo/enter-leave.md
+++ b/components/queue-anim/demo/enter-leave.md
@@ -47,7 +47,8 @@ const Test = React.createClass({
         <QueueAnim className="demo-content"
           key="demo"
           type={['right', 'left']}
-          ease={['easeOutQuart', 'easeInOutQuart']}>
+          ease={['easeOutQuart', 'easeInOutQuart']}
+        >
           {list}
         </QueueAnim>
       </div>
diff --git a/components/select/demo/combobox.md b/components/select/demo/combobox.md
index e4b1555a0d..31ec65cc1f 100644
--- a/components/select/demo/combobox.md
+++ b/components/select/demo/combobox.md
@@ -34,7 +34,8 @@ const Test = React.createClass({
         style={{ width: 200 }}
         onChange={this.handleChange}
         filterOption={false}
-        placeholder="请输入账户名">
+        placeholder="请输入账户名"
+      >
         {this.state.options}
       </Select>
     );
diff --git a/components/select/demo/multiple.md b/components/select/demo/multiple.md
index 36103f71a5..656f9463f3 100644
--- a/components/select/demo/multiple.md
+++ b/components/select/demo/multiple.md
@@ -22,7 +22,8 @@ ReactDOM.render(
   <Select multiple
     style={{ width: '100%' }}
     placeholder="Please select"
-    defaultValue={['a10', 'c12']} onChange={handleChange}>
+    defaultValue={['a10', 'c12']} onChange={handleChange}
+  >
     {children}
   </Select>
 , mountNode);
diff --git a/components/select/demo/optgroup.md b/components/select/demo/optgroup.md
index ea9ca27309..7a0b52fbf2 100644
--- a/components/select/demo/optgroup.md
+++ b/components/select/demo/optgroup.md
@@ -18,7 +18,8 @@ ReactDOM.render(
   <Select defaultValue="lucy"
     style={{ width: 200 }}
     showSearch={false}
-    onChange={handleChange}>
+    onChange={handleChange}
+  >
     <OptGroup label="Manager">
       <Option value="jack">jack</Option>
       <Option value="lucy">lucy</Option>
diff --git a/components/select/demo/search-box.md b/components/select/demo/search-box.md
index ec2aad8ce2..761bde1cc9 100644
--- a/components/select/demo/search-box.md
+++ b/components/select/demo/search-box.md
@@ -88,7 +88,8 @@ const SearchInput = React.createClass({
             filterOption={false}
             onChange={this.handleChange}
             onFocus={this.handleFocusBlur}
-            onBlur={this.handleFocusBlur}>
+            onBlur={this.handleFocusBlur}
+          >
             {options}
           </Select>
           <div className="ant-input-group-wrap">
diff --git a/components/select/demo/search.md b/components/select/demo/search.md
index e2593c0a0b..5bd4520e18 100644
--- a/components/select/demo/search.md
+++ b/components/select/demo/search.md
@@ -19,7 +19,8 @@ ReactDOM.render(
     placeholder="请选择人员"
     optionFilterProp="children"
     notFoundContent="无法找到"
-    onChange={handleChange}>
+    onChange={handleChange}
+  >
     <Option value="jack">杰克</Option>
     <Option value="lucy">露西</Option>
     <Option value="tom">汤姆</Option>
diff --git a/components/select/demo/tags.md b/components/select/demo/tags.md
index 6ff4160aa9..e340c7f915 100644
--- a/components/select/demo/tags.md
+++ b/components/select/demo/tags.md
@@ -22,7 +22,8 @@ ReactDOM.render(
   <Select tags
     style={{ width: '100%' }}
     searchPlaceholder="标签模式"
-    onChange={handleChange}>
+    onChange={handleChange}
+  >
     {children}
   </Select>
 , mountNode);
diff --git a/components/select/index.jsx b/components/select/index.jsx
index ceb0ec2686..864f0655ee 100644
--- a/components/select/index.jsx
+++ b/components/select/index.jsx
@@ -44,7 +44,8 @@ export default class Select extends React.Component {
       <RcSelect {...this.props}
         className={cls}
         optionLabelProp={optionLabelProp || 'children'}
-        notFoundContent={notFoundContent} />
+        notFoundContent={notFoundContent}
+      />
     );
   }
 }
diff --git a/components/slider/demo/input-number.md b/components/slider/demo/input-number.md
index 8e3d9873d2..dde87b5019 100644
--- a/components/slider/demo/input-number.md
+++ b/components/slider/demo/input-number.md
@@ -27,7 +27,8 @@ const IntegerStep = React.createClass({
         </Col>
         <Col span={4}>
           <InputNumber min={1} max={20} style={{ marginLeft: '16px' }}
-            value={this.state.inputValue} onChange={this.onChange} />
+            value={this.state.inputValue} onChange={this.onChange}
+          />
         </Col>
       </Row>
     );
@@ -53,7 +54,8 @@ const DecimalStep = React.createClass({
         </Col>
         <Col span={4}>
           <InputNumber min={0} max={1} style={{ marginLeft: '16px' }} step={0.01}
-            value={this.state.inputValue} onChange={this.onChange} />
+            value={this.state.inputValue} onChange={this.onChange}
+          />
         </Col>
       </Row>
     );
diff --git a/components/spin/demo/nested.md b/components/spin/demo/nested.md
index 61470113b0..2f82930e21 100644
--- a/components/spin/demo/nested.md
+++ b/components/spin/demo/nested.md
@@ -19,7 +19,8 @@ const Card = React.createClass({
     const container = (
       <Alert message="消息提示的文案"
         description="消息提示的辅助性文字介绍消息提示的辅助性文字介绍消息提示的辅助性文字介绍"
-        type="info" />
+        type="info"
+      />
     );
     return (
       <div>
diff --git a/components/spin/demo/tip.md b/components/spin/demo/tip.md
index 9843620ea2..887600ba65 100644
--- a/components/spin/demo/tip.md
+++ b/components/spin/demo/tip.md
@@ -12,7 +12,8 @@ ReactDOM.render(
   <Spin tip="正在读取数据...">
     <Alert message="消息提示的文案"
       description="消息提示的辅助性文字介绍消息提示的辅助性文字介绍消息提示的辅助性文字介绍"
-      type="info" />
+      type="info"
+    />
   </Spin>
 , mountNode);
 ````
diff --git a/components/table/demo/ajax.md b/components/table/demo/ajax.md
index 1a7d897ec3..96528649d7 100644
--- a/components/table/demo/ajax.md
+++ b/components/table/demo/ajax.md
@@ -89,7 +89,8 @@ const Test = React.createClass({
         dataSource={this.state.data}
         pagination={this.state.pagination}
         loading={this.state.loading}
-        onChange={this.handleTableChange} />
+        onChange={this.handleTableChange}
+      />
     );
   },
 });
diff --git a/components/table/demo/expand.md b/components/table/demo/expand.md
index 3a88d1e8e7..204cf4c53e 100644
--- a/components/table/demo/expand.md
+++ b/components/table/demo/expand.md
@@ -25,6 +25,7 @@ ReactDOM.render(
   <Table columns={columns}
     expandedRowRender={record => <p>{record.description}</p>}
     dataSource={data}
-    className="table" />
+    className="table"
+  />
 , mountNode);
 ````
diff --git a/components/table/demo/row-selection-and-operation.md b/components/table/demo/row-selection-and-operation.md
index 1aa99d5cad..2b02e31c75 100644
--- a/components/table/demo/row-selection-and-operation.md
+++ b/components/table/demo/row-selection-and-operation.md
@@ -61,7 +61,8 @@ const App = React.createClass({
       <div>
         <div style={{ marginBottom: 16 }}>
           <Button type="primary" onClick={this.start}
-            disabled={!hasSelected} loading={loading}>操作</Button>
+            disabled={!hasSelected} loading={loading}
+          >操作</Button>
           <span style={{ marginLeft: 8 }}>{hasSelected ? `选择了 ${selectedRowKeys.length} 个对象` : ''}</span>
         </div>
         <Table rowSelection={rowSelection} columns={columns} dataSource={data} />
diff --git a/components/table/filterDropdown.jsx b/components/table/filterDropdown.jsx
index 36166ff95d..f913c9b8ce 100644
--- a/components/table/filterDropdown.jsx
+++ b/components/table/filterDropdown.jsx
@@ -113,16 +113,19 @@ export default class FilterMenu extends React.Component {
           prefixCls="ant-dropdown-menu"
           onSelect={this.setSelectedKeys}
           onDeselect={this.setSelectedKeys}
-          selectedKeys={this.state.selectedKeys}>
+          selectedKeys={this.state.selectedKeys}
+        >
           {this.renderMenus(column.filters)}
         </Menu>
         <div className="ant-table-filter-dropdown-btns">
           <a className="ant-table-filter-dropdown-link confirm"
-            onClick={this.handleConfirm}>
+            onClick={this.handleConfirm}
+          >
             {locale.filterConfirm}
           </a>
           <a className="ant-table-filter-dropdown-link clear"
-            onClick={this.handleClearFilters}>
+            onClick={this.handleClearFilters}
+          >
             {locale.filterReset}
           </a>
         </div>
@@ -137,7 +140,8 @@ export default class FilterMenu extends React.Component {
         overlay={menus}
         visible={this.state.visible}
         onVisibleChange={this.onVisibleChange}
-        closeOnSelect={false}>
+        closeOnSelect={false}
+      >
         <Icon title={locale.filterTitle} type="filter" className={dropdownSelectedClass} />
       </Dropdown>
     );
diff --git a/components/table/index.jsx b/components/table/index.jsx
index 8a3d23e4c7..b82bb0fe2c 100644
--- a/components/table/index.jsx
+++ b/components/table/index.jsx
@@ -430,7 +430,8 @@ export default class Table extends React.Component {
     return (
       <Radio disabled={props.disabled} onClick={stopPropagation}
         onChange={(e) => this.handleRadioSelect(record, rowIndex, e)}
-        value={rowIndex} checked={checked} />
+        value={rowIndex} checked={checked}
+      />
     );
   }
 
@@ -449,7 +450,8 @@ export default class Table extends React.Component {
     }
     return (
       <Checkbox checked={checked} disabled={props.disabled} onClick={stopPropagation}
-        onChange={(e) => this.handleSelect(record, rowIndex, e)} />
+        onChange={(e) => this.handleSelect(record, rowIndex, e)}
+      />
     );
   }
 
@@ -498,7 +500,8 @@ export default class Table extends React.Component {
         const checkboxAll = (
           <Checkbox checked={checked}
             disabled={checkboxAllDisabled}
-            onChange={this.handleSelectAllRow} />
+            onChange={this.handleSelectAllRow}
+          />
         );
         selectionColumn = {
           key: 'selection-column',
@@ -544,7 +547,8 @@ export default class Table extends React.Component {
         filterDropdown = (
           <FilterDropdown locale={locale} column={column}
             selectedKeys={colFilters}
-            confirmFilter={this.handleFilter} />
+            confirmFilter={this.handleFilter}
+          />
         );
       }
       if (column.sorter) {
@@ -561,12 +565,14 @@ export default class Table extends React.Component {
           <div className="ant-table-column-sorter">
             <span className={`ant-table-column-sorter-up ${isAscend ? 'on' : 'off'}`}
               title="↑"
-              onClick={() => this.toggleSortOrder('ascend', column)}>
+              onClick={() => this.toggleSortOrder('ascend', column)}
+            >
               <Icon type="caret-up" />
             </span>
             <span className={`ant-table-column-sorter-down ${isDescend ? 'on' : 'off'}`}
               title="↓"
-              onClick={() => this.toggleSortOrder('descend', column)}>
+              onClick={() => this.toggleSortOrder('descend', column)}
+            >
               <Icon type="caret-down" />
             </span>
           </div>
@@ -612,7 +618,8 @@ export default class Table extends React.Component {
         onChange={this.handlePageChange}
         total={total}
         size={size}
-        onShowSizeChange={this.handleShowSizeChange} /> : null;
+        onShowSizeChange={this.handleShowSizeChange}
+      /> : null;
   }
 
   prepareParamsArguments(state) {
@@ -729,7 +736,8 @@ export default class Table extends React.Component {
           columns={columns}
           className={classString}
           expandIconColumnIndex={(columns[0] && columns[0].key === 'selection-column') ? 1 : 0}
-          expandIconAsCell={expandIconAsCell} />
+          expandIconAsCell={expandIconAsCell}
+        />
           {emptyText}
       </div>
     );
diff --git a/components/tabs/demo/custom-add-trigger.md b/components/tabs/demo/custom-add-trigger.md
index e642ace3fc..87019fd265 100644
--- a/components/tabs/demo/custom-add-trigger.md
+++ b/components/tabs/demo/custom-add-trigger.md
@@ -54,7 +54,8 @@ const Demo = React.createClass({
           <Button type="ghost" onClick={this.add}>新增</Button>
         </div>
         <Tabs hideAdd onChange={this.onChange} activeKey={this.state.activeKey}
-          type="editable-card" onEdit={this.onEdit}>
+          type="editable-card" onEdit={this.onEdit}
+        >
           {this.state.panes}
         </Tabs>
       </div>
diff --git a/components/tabs/demo/editable-card.md b/components/tabs/demo/editable-card.md
index a462b4d778..98f92cd12e 100644
--- a/components/tabs/demo/editable-card.md
+++ b/components/tabs/demo/editable-card.md
@@ -50,7 +50,8 @@ const Demo = React.createClass({
   render() {
     return (
       <Tabs onChange={this.onChange} activeKey={this.state.activeKey}
-        type="editable-card" onEdit={this.onEdit}>
+        type="editable-card" onEdit={this.onEdit}
+      >
         {this.state.panes}
       </Tabs>
     );
diff --git a/components/tabs/demo/position.md b/components/tabs/demo/position.md
index 31b91ca01c..8ba2eddf4e 100644
--- a/components/tabs/demo/position.md
+++ b/components/tabs/demo/position.md
@@ -25,7 +25,8 @@ const Demo = React.createClass({
         <div style={{ marginBottom: 16 }}>
           页签位置：
           <Select value={this.state.tabPosition} onChange={this.changeTabPosition}
-            dropdownMatchSelectWidth={false}>
+            dropdownMatchSelectWidth={false}
+          >
             <Option value="top">top</Option>
             <Option value="bottom">bottom</Option>
             <Option value="left">left</Option>
diff --git a/components/tabs/index.jsx b/components/tabs/index.jsx
index b175df05dd..f06543682c 100644
--- a/components/tabs/index.jsx
+++ b/components/tabs/index.jsx
@@ -77,7 +77,8 @@ export default class Tabs extends React.Component {
         className={className}
         tabBarExtraContent={tabBarExtraContent}
         onChange={this.handleChange}
-        animation={animation}>
+        animation={animation}
+      >
         {children}
       </RcTabs>
     );
diff --git a/components/tag/index.jsx b/components/tag/index.jsx
index bcb9716fa7..229b821c49 100644
--- a/components/tag/index.jsx
+++ b/components/tag/index.jsx
@@ -58,7 +58,8 @@ export default class Tag extends React.Component {
         showProp="data-show"
         transitionName={`${prefixCls}-zoom`}
         transitionAppear
-        onEnd={this.animationEnd}>
+        onEnd={this.animationEnd}
+      >
         {this.state.closed ? null : (
           <div data-show={!this.state.closing} {...restProps} className={classString}>
             <span className={`${prefixCls}-text`}>{children}</span>
diff --git a/components/tooltip/index.jsx b/components/tooltip/index.jsx
index 2801b14202..aacd356ebf 100644
--- a/components/tooltip/index.jsx
+++ b/components/tooltip/index.jsx
@@ -83,7 +83,8 @@ export default class Tooltip extends React.Component {
         onVisibleChange={this.onVisibleChange}
         onPopupAlign={this.onPopupAlign}
         ref="tooltip"
-        {...this.props}>
+        {...this.props}
+      >
         {visible ? cloneElement(children, { className: childrenCls }) : children}
       </RcTooltip>
     );
diff --git a/components/transfer/demo/advanced.md b/components/transfer/demo/advanced.md
index afad03dfab..c6ecf0f355 100644
--- a/components/transfer/demo/advanced.md
+++ b/components/transfer/demo/advanced.md
@@ -41,7 +41,8 @@ const App = React.createClass({
   renderFooter() {
     return (
       <Button type="ghost" size="small" style={{ float: 'right', margin: 5 }}
-        onClick={this.getMock}>
+        onClick={this.getMock}
+      >
         刷新
       </Button>
     );
@@ -59,7 +60,8 @@ const App = React.createClass({
         targetKeys={this.state.targetKeys}
         onChange={this.handleChange}
         render={item => `${item.title}-${item.description}`}
-        footer={this.renderFooter} />
+        footer={this.renderFooter}
+      />
     );
   },
 });
diff --git a/components/transfer/demo/basic.md b/components/transfer/demo/basic.md
index 40c661f5e8..18851ff522 100644
--- a/components/transfer/demo/basic.md
+++ b/components/transfer/demo/basic.md
@@ -45,7 +45,8 @@ const App = React.createClass({
         dataSource={this.state.mockData}
         targetKeys={this.state.targetKeys}
         onChange={this.handleChange}
-        render={item => item.title} />
+        render={item => item.title}
+      />
     );
   },
 });
diff --git a/components/transfer/demo/custom-item.md b/components/transfer/demo/custom-item.md
index 1deebe7065..1fe30777ac 100644
--- a/components/transfer/demo/custom-item.md
+++ b/components/transfer/demo/custom-item.md
@@ -61,7 +61,8 @@ const App = React.createClass({
         }}
         targetKeys={this.state.targetKeys}
         onChange={this.handleChange}
-        render={this.renderItem} />
+        render={this.renderItem}
+      />
     );
   },
 });
diff --git a/components/transfer/demo/search.md b/components/transfer/demo/search.md
index 2ac61aed71..2af56ed4be 100644
--- a/components/transfer/demo/search.md
+++ b/components/transfer/demo/search.md
@@ -46,7 +46,8 @@ const App = React.createClass({
         notFoundContent="xxxxxx"
         targetKeys={this.state.targetKeys}
         onChange={this.handleChange}
-        render={item => item.title} />
+        render={item => item.title}
+      />
     );
   },
 });
diff --git a/components/transfer/index.jsx b/components/transfer/index.jsx
index 9167345542..f4a045506d 100644
--- a/components/transfer/index.jsx
+++ b/components/transfer/index.jsx
@@ -254,14 +254,16 @@ export default class Transfer extends React.Component {
           notFoundContent={notFoundContent}
           body={body}
           footer={footer}
-          prefixCls={`${prefixCls}-list`} />
+          prefixCls={`${prefixCls}-list`}
+        />
         <Operation rightActive={rightActive}
           rightArrowText={operations[0]}
           moveToRight={this.moveToRight}
           leftActive={leftActive}
           leftArrowText={operations[1]}
           moveToLeft={this.moveToLeft}
-          className={`${prefixCls}-operation`} />
+          className={`${prefixCls}-operation`}
+        />
         <List titleText={titles[1]}
           dataSource={rightDataSource}
           filter={rightFilter}
@@ -279,7 +281,8 @@ export default class Transfer extends React.Component {
           notFoundContent={notFoundContent}
           body={body}
           footer={footer}
-          prefixCls={`${prefixCls}-list`} />
+          prefixCls={`${prefixCls}-list`}
+        />
       </div>
     );
   }
diff --git a/components/transfer/list.jsx b/components/transfer/list.jsx
index ae9db4d8c0..c0f88e5e1b 100644
--- a/components/transfer/list.jsx
+++ b/components/transfer/list.jsx
@@ -93,7 +93,8 @@ export default class TransferList extends React.Component {
     return (
       <span ref="checkbox"
         className={checkboxCls}
-        onClick={(!props.disabled) && this.handleSelectAll}>
+        onClick={(!props.disabled) && this.handleSelectAll}
+      >
         {customEle}
       </span>
     );
@@ -188,11 +189,13 @@ export default class TransferList extends React.Component {
                 onChange={this.handleFilter}
                 handleClear={this.handleClear}
                 placeholder={searchPlaceholder || '请输入搜索内容'}
-                value={filter} />
+                value={filter}
+              />
             </div> : null}
             <Animate component="ul"
               transitionName={this.state.mounted ? `${prefixCls}-highlight` : ''}
-              transitionLeave={false}>
+              transitionLeave={false}
+            >
               {showItems.length > 0
                 ? showItems
                 : <div className={`${prefixCls}-body-not-found`}>{notFoundContent || '列表为空'}</div>}
diff --git a/components/transfer/search.jsx b/components/transfer/search.jsx
index e802a65606..153fe7f806 100644
--- a/components/transfer/search.jsx
+++ b/components/transfer/search.jsx
@@ -31,7 +31,8 @@ export default class Search extends React.Component {
     return (
       <div>
         <input placeholder={placeholder} className={`${prefixCls} ant-input`} value={value} ref="input"
-          onChange={this.handleChange} />
+          onChange={this.handleChange}
+        />
         {value && value.length > 0 ?
           <a href="#" className={`${prefixCls}-action`} onClick={this.handleClear}>
             <Icon type="cross-circle" />
diff --git a/components/tree-select/demo/basic.md b/components/tree-select/demo/basic.md
index b78cc1d655..ce2f82ce23 100644
--- a/components/tree-select/demo/basic.md
+++ b/components/tree-select/demo/basic.md
@@ -27,7 +27,8 @@ const Demo = React.createClass({
         placeholder="请选择"
         allowClear
         treeDefaultExpandAll
-        onChange={this.onChange}>
+        onChange={this.onChange}
+      >
         <TreeNode value="parent 1" title="parent 1" key="0-1">
           <TreeNode value="parent 1-0" title="parent 1-0" key="0-1-1">
             <TreeNode value="leaf1" title="my leaf" key="random" />
diff --git a/components/tree-select/demo/treeData.md b/components/tree-select/demo/treeData.md
index 94a54a085e..e325dca398 100644
--- a/components/tree-select/demo/treeData.md
+++ b/components/tree-select/demo/treeData.md
@@ -45,7 +45,8 @@ const Demo = React.createClass({
         treeData={treeData}
         placeholder="请选择"
         treeDefaultExpandAll
-        onChange={this.onChange} />
+        onChange={this.onChange}
+      />
     );
   },
 });
diff --git a/components/tree-select/index.jsx b/components/tree-select/index.jsx
index 0959271a89..03c597df87 100644
--- a/components/tree-select/index.jsx
+++ b/components/tree-select/index.jsx
@@ -50,7 +50,8 @@ export default class TreeSelect extends React.Component {
       <RcTreeSelect {...this.props}
         treeCheckable={checkable}
         className={cls}
-        notFoundContent={notFoundContent} />
+        notFoundContent={notFoundContent}
+      />
     );
   }
 }
diff --git a/components/tree/demo/basic-controlled.md b/components/tree/demo/basic-controlled.md
index 694ec4b6d9..af9966b5f6 100644
--- a/components/tree/demo/basic-controlled.md
+++ b/components/tree/demo/basic-controlled.md
@@ -86,7 +86,8 @@ const Demo = React.createClass({
         onExpand={this.onExpand} expandedKeys={this.state.expandedKeys}
         autoExpandParent={this.state.autoExpandParent}
         onCheck={this.onCheck} checkedKeys={this.state.checkedKeys}
-        onSelect={this.onSelect} selectedKeys={this.state.selectedKeys}>
+        onSelect={this.onSelect} selectedKeys={this.state.selectedKeys}
+      >
         {loop(gData)}
       </Tree>
     );
diff --git a/components/tree/demo/basic.md b/components/tree/demo/basic.md
index 619ff64d08..9c3451f599 100644
--- a/components/tree/demo/basic.md
+++ b/components/tree/demo/basic.md
@@ -35,7 +35,8 @@ const Demo = React.createClass({
         defaultExpandedKeys={this.state.defaultExpandedKeys}
         defaultSelectedKeys={this.state.defaultSelectedKeys}
         defaultCheckedKeys={this.state.defaultCheckedKeys}
-        onSelect={this.onSelect} onCheck={this.onCheck}>
+        onSelect={this.onSelect} onCheck={this.onCheck}
+      >
         <TreeNode title="parent 1" key="0-0">
           <TreeNode title="parent 1-0" key="0-0-0" disabled>
             <TreeNode title="leaf" key="0-0-0-0" disableCheckbox />
diff --git a/components/tree/demo/draggable.md b/components/tree/demo/draggable.md
index 17cbd89995..542f0d220a 100644
--- a/components/tree/demo/draggable.md
+++ b/components/tree/demo/draggable.md
@@ -101,7 +101,8 @@ const Demo = React.createClass({
     return (
       <Tree defaultExpandedKeys={this.state.expandedKeys} openAnimation={{}} draggable
         onDragEnter={this.onDragEnter}
-        onDrop={this.onDrop}>
+        onDrop={this.onDrop}
+      >
         {loop(this.state.gData)}
       </Tree>
     );
diff --git a/components/upload/index.jsx b/components/upload/index.jsx
index f0ecba8fa6..713026ef33 100644
--- a/components/upload/index.jsx
+++ b/components/upload/index.jsx
@@ -246,7 +246,8 @@ export default class Upload extends React.Component {
         <UploadList listType={this.props.listType}
           items={this.state.fileList}
           onPreview={this.handlePreview}
-          onRemove={this.handleManualRemove} />
+          onRemove={this.handleManualRemove}
+        />
       );
     }
     if (type === 'drag') {
@@ -259,7 +260,8 @@ export default class Upload extends React.Component {
           <div className={`${prefixCls} ${prefixCls}-drag ${dragUploadingClass} ${draggingClass}`}
             onDrop={this.onFileDrop}
             onDragOver={this.onFileDrop}
-            onDragLeave={this.onFileDrop}>
+            onDragLeave={this.onFileDrop}
+          >
             <RcUpload {...props}>
               <div className={`${prefixCls}-drag-container`}>
                 {this.props.children}
diff --git a/components/upload/uploadList.jsx b/components/upload/uploadList.jsx
index 63dd77d6e1..54131b09c3 100644
--- a/components/upload/uploadList.jsx
+++ b/components/upload/uploadList.jsx
@@ -73,7 +73,8 @@ export default class UploadList extends React.Component {
               className={`${prefixCls}-list-item-thumbnail`}
               onClick={e => this.handlePreview(file, e)}
               href={file.url}
-              target="_blank">
+              target="_blank"
+            >
               <img src={file.thumbUrl || file.url} alt={file.name} />
             </a>
           );
@@ -101,7 +102,8 @@ export default class UploadList extends React.Component {
                 <a
                   onClick={(e) => this.handlePreview(file, e)}
                   href={file.url} target="_blank"
-                  className={`${prefixCls}-list-item-name`}>
+                  className={`${prefixCls}-list-item-name`}
+                >
                   {file.name}
                 </a>
               ) : <span className={`${prefixCls}-list-item-name`}>{file.name}</span>
@@ -114,7 +116,8 @@ export default class UploadList extends React.Component {
                     onClick={(e) => this.handlePreview(file, e)}
                     href={file.url}
                     target="_blank"
-                    style={{ pointerEvents: file.url ? '' : 'none' }}>
+                    style={{ pointerEvents: file.url ? '' : 'none' }}
+                  >
                     <Icon type="eye-o" />
                   </a>
                   <Icon type="delete" onClick={() => this.handleClose(file)} />
diff --git a/docs/react/introduce.md b/docs/react/introduce.md
index deeedd02c9..c203cced21 100644
--- a/docs/react/introduce.md
+++ b/docs/react/introduce.md
@@ -67,7 +67,7 @@ import 'antd/dist/antd.css';  // or 'antd/dist/antd.less'
 ## 链接
 
 - [首页](http://ant.design/)
-- [修改记录](/docs/react/changelog)
+- [更新日志](/changelog)
 - [开发脚手架](https://github.com/ant-design/antd-init/)
 - [开发工具文档](http://ant-tool.github.io/)
 - [React 组件](http://react-component.github.io/)
diff --git a/docs/react/upgrade-notes.md b/docs/react/upgrade-notes.md
index a3f8f3767d..2d55a9fa6e 100644
--- a/docs/react/upgrade-notes.md
+++ b/docs/react/upgrade-notes.md
@@ -3,11 +3,11 @@ order: 4
 english: 升级指南
 ---
 
-此处着重列出升级中的不兼容变化和推荐改动。所有变动请见 [Changelog](/docs/react/changelog)。
+此处着重列出升级中的不兼容变化和推荐改动。所有变动请见 [更新日志](/changelog)。
 
 ## 0.12 => 1.0
 
-`1.0.0` 之后将不再单独提供升级指南，请参考对应版本 [Changelog](/docs/react/changelog) 中的 `不兼容改动` 进行升级。
+`1.0.0` 之后将不再单独提供升级指南，请参考对应版本 [更新日志](/changelog) 中的 `不兼容改动` 进行升级。
 
 ## 0.11 => 0.12
 
@@ -146,4 +146,4 @@ import 'antd/style/index.less';
 - Slider 的 `withDots` `isIncluded` 属性修改为 `dots` `included`。
 - iconfont 的基线更新，可能导致原有图标的位置偏移。
 
-新版本变化较大，以上升级指南可能有遗漏，全部改动可以参考 [Changelog](/docs/react/changelog)。在升级过程中遇到问题，欢迎 [报告](https://github.com/ant-design/ant-design/issues/new) 给我们。
+新版本变化较大，以上升级指南可能有遗漏，全部改动可以参考 [更新日志](/changelog)。在升级过程中遇到问题，欢迎 [报告](https://github.com/ant-design/ant-design/issues/new) 给我们。
diff --git a/site/bisheng-plugin-antd/lib/ImagePreview.jsx b/site/bisheng-plugin-antd/lib/ImagePreview.jsx
index 4e7d663f93..d3d62d2fae 100644
--- a/site/bisheng-plugin-antd/lib/ImagePreview.jsx
+++ b/site/bisheng-plugin-antd/lib/ImagePreview.jsx
@@ -15,16 +15,19 @@ function PreviewImageBox({ cover, coverMeta, imgs, style, previewVisible,
   return (
     <div className="preview-image-box"
       style={style}
-      onClick={onClick}>
+      onClick={onClick}
+    >
       <div className={`preview-image-wrapper ${coverMeta.isGood && 'good'} ${coverMeta.isBad && 'bad'}`}>
         <img className={coverMeta.className} src={coverMeta.src} alt={coverMeta.alt} />
       </div>
       <div className="preview-image-title">{coverMeta.alt}</div>
       <div className="preview-image-description"
-        dangerouslySetInnerHTML={{ __html: coverMeta.description }} />
+        dangerouslySetInnerHTML={{ __html: coverMeta.description }}
+      />
 
       <Modal className="image-modal" width={960} visible={previewVisible} title={null} footer={null}
-        onCancel={onCancel}>
+        onCancel={onCancel}
+      >
         <Carousel className={`${onlyOneImg ? 'image-modal-single' : ''}`} adaptiveHeight>
           {comparable ? cover : imgs}
         </Carousel>
diff --git a/site/bisheng-plugin-antd/lib/VideoPlayer.jsx b/site/bisheng-plugin-antd/lib/VideoPlayer.jsx
index 5207ed325d..c0d9289a33 100644
--- a/site/bisheng-plugin-antd/lib/VideoPlayer.jsx
+++ b/site/bisheng-plugin-antd/lib/VideoPlayer.jsx
@@ -12,7 +12,8 @@ export default function VideoPlayer({ video }) {
       </div>
       <div className="preview-image-title">{alt}</div>
       <div className="preview-image-description"
-        dangerouslySetInnerHTML={{ __html: description }} />
+        dangerouslySetInnerHTML={{ __html: description }}
+      />
     </div>
   );
 }
diff --git a/site/theme/static/markdown.less b/site/theme/static/markdown.less
index 2209bc32a9..ed6a7a1c65 100644
--- a/site/theme/static/markdown.less
+++ b/site/theme/static/markdown.less
@@ -188,14 +188,14 @@
     background-image: linear-gradient(90deg, #F5F5F5 4.16666667%, transparent 4.16666667%, transparent 8.33333333%, #F5F5F5 8.33333333%, #F5F5F5 12.5%,  transparent 12.5%, transparent 16.66666667%, #F5F5F5 16.66666667%, #F5F5F5 20.83333333%, transparent 20.83333333%, transparent 25%, #F5F5F5 25%, #F5F5F5 29.16666667%, transparent 29.16666667%, transparent 33.33333333%, #F5F5F5 33.33333333%, #F5F5F5 37.5%, transparent 37.5%, transparent 41.66666667%, #F5F5F5 41.66666667%, #F5F5F5 45.83333333%, transparent 45.83333333%, transparent 50%, #F5F5F5 50%, #F5F5F5 54.16666667%, transparent 54.16666667%, transparent 58.33333333%, #F5F5F5 58.33333333%, #F5F5F5 62.5%, transparent 62.5%, transparent 66.66666667%, #F5F5F5 66.66666667%, #F5F5F5 70.83333333%,  transparent 70.83333333%, transparent 75%, #F5F5F5 75%, #F5F5F5 79.16666667%, transparent 79.16666667%, transparent 83.33333333%, #F5F5F5 83.33333333%, #F5F5F5 87.5%, transparent 87.5%, transparent 91.66666667%, #F5F5F5 91.66666667%, #F5F5F5 95.83333333%, transparent 95.83333333%);
     overflow: hidden;
   }
-  .row-flex,
-  .code-box-demo .row-flex {
+  .ant-row-flex,
+  .code-box-demo .ant-row-flex {
     background: #F5F5F5;
   }
-  .row > div,
-  .code-box-demo .row > div,
-  .row-flex > div,
-  .code-box-demo .row-flex > div {
+  .ant-row > div,
+  .code-box-demo .ant-row > div,
+  .ant-row-flex > div,
+  .code-box-demo .ant-row-flex > div {
     padding: 5px 0;
     text-align: center;
     border-radius: 6px;
@@ -204,13 +204,13 @@
     margin-bottom: 10px;
     color: #fff;
   }
-  .code-box-demo .row > div:not(.gutter-row),
-  .code-box-demo .row-flex > div:not(.gutter-row) {
+  .code-box-demo .ant-row > div:not(.gutter-row),
+  .code-box-demo .ant-row-flex > div:not(.gutter-row) {
     background: #6AC2F5;
     border: 1px solid rgba(0, 0, 0, 0.1);
   }
-  .row .demo-col,
-  .code-box-demo .row .demo-col {
+  .ant-row .demo-col,
+  .code-box-demo .ant-row .demo-col {
     text-align: center;
     padding: 40px 0;
     color: #fff;
@@ -219,25 +219,25 @@
     margin-top: 0;
     margin-bottom: 0;
   }
-  .row .demo-col-1,
-  .row .demo-col-1 {
+  .ant-row .demo-col-1,
+  .ant-row .demo-col-1 {
     background: rgba(29, 128, 211, 0.7);
   }
-  .row .demo-col-2,
-  .code-box-demo .row .demo-col-2 {
+  .ant-row .demo-col-2,
+  .code-box-demo .ant-row .demo-col-2 {
     background: rgba(29, 128, 211, 0.5);
   }
-  .row .demo-col-3,
-  .code-box-demo .row .demo-col-3{
+  .ant-row .demo-col-3,
+  .code-box-demo .ant-row .demo-col-3{
     background: rgba(255, 255, 255, 0.2);
     color: #999;
   }
-  .row .demo-col-4,
-  .code-box-demo .row .demo-col-4 {
+  .ant-row .demo-col-4,
+  .code-box-demo .ant-row .demo-col-4 {
     background: rgba(29, 128, 211, 0.6);
   }
-  .row .demo-col-5,
-  .code-box-demo .row .demo-col-5 {
+  .ant-row .demo-col-5,
+  .code-box-demo .ant-row .demo-col-5 {
     background: rgba(255, 255, 255, 0.5);
     color: #999;
   }
diff --git a/site/theme/template/Content/ComponentDoc.jsx b/site/theme/template/Content/ComponentDoc.jsx
index 6b93c65f80..d7a8a64ad6 100644
--- a/site/theme/template/Content/ComponentDoc.jsx
+++ b/site/theme/template/Content/ComponentDoc.jsx
@@ -42,13 +42,15 @@ export default class ComponentDoc extends React.Component {
           leftChildren.push(
             <Demo {...demoData}
               key={index} utils={props.utils}
-              expand={expand} pathname={location.pathname} />
+              expand={expand} pathname={location.pathname}
+            />
           );
         } else {
           rightChildren.push(
             <Demo {...demoData}
               key={index} utils={props.utils}
-              expand={expand} pathname={location.pathname} />
+              expand={expand} pathname={location.pathname}
+            />
           );
         }
       });
@@ -89,7 +91,8 @@ export default class ComponentDoc extends React.Component {
             <h2>
               代码演示
               <Icon type="appstore" className={expandTriggerClass}
-                title="展开全部代码" onClick={this.handleExpandToggle} />
+                title="展开全部代码" onClick={this.handleExpandToggle}
+              />
             </h2>
           </section>
           <Row gutter={16}>
diff --git a/site/theme/template/Content/Demo.jsx b/site/theme/template/Content/Demo.jsx
index a5cd27c925..04a9282847 100644
--- a/site/theme/template/Content/Demo.jsx
+++ b/site/theme/template/Content/Demo.jsx
@@ -78,10 +78,12 @@ export default class Demo extends React.Component {
           {introChildren}
           <span className="collapse anticon anticon-circle-o-right"
             onClick={this.handleCodeExapnd}
-            unselectable="none" />
+            unselectable="none"
+          />
         </section>
         <section className={highlightClass}
-          key="code">
+          key="code"
+        >
           <div className="highlight">
             {props.utils.toReactComponent(highlightedCode)}
           </div>
@@ -91,7 +93,8 @@ export default class Demo extends React.Component {
                 <pre>
                   <code className="css" dangerouslySetInnerHTML={{
                     __html: highlightedStyle,
-                  }} />
+                  }}
+                  />
                 </pre>
               </div> :
               null
diff --git a/site/theme/template/Content/MainContent.jsx b/site/theme/template/Content/MainContent.jsx
index 08e3c75ddb..1fd9adf07b 100644
--- a/site/theme/template/Content/MainContent.jsx
+++ b/site/theme/template/Content/MainContent.jsx
@@ -163,7 +163,8 @@ export default class MainContent extends React.Component {
           <Col lg={4} md={6} sm={24} xs={24}>
             <Menu className="aside-container" mode="inline"
               defaultOpenKeys={Object.keys(utils.getMenuItems(moduleData, locale))}
-              selectedKeys={[activeMenuItem]}>
+              selectedKeys={[activeMenuItem]}
+            >
               {menuItems}
             </Menu>
           </Col>
@@ -179,7 +180,8 @@ export default class MainContent extends React.Component {
         <Row>
           <Col lg={{ span: 20, offset: 4 }}
             md={{ span: 18, offset: 6 }}
-            sm={24} xs={24}>
+            sm={24} xs={24}
+          >
             <section className="prev-next-nav">
               {
                 !!prev ?
diff --git a/site/theme/template/Home/Banner.jsx b/site/theme/template/Home/Banner.jsx
index a505711763..e7f2b65603 100644
--- a/site/theme/template/Home/Banner.jsx
+++ b/site/theme/template/Home/Banner.jsx
@@ -30,7 +30,8 @@ export default class Banner extends React.Component {
               </Link>
             </div>
             <GitHubButton key="github-button" type="stargazers"
-              namespace="ant-design" repo="ant-design" />
+              namespace="ant-design" repo="ant-design"
+            />
           </QueueAnim>
           <Icon type="down" className="down" />
         </ScrollElement>
diff --git a/site/theme/template/Home/Page1.jsx b/site/theme/template/Home/Page1.jsx
index 040365c076..1f196223b2 100644
--- a/site/theme/template/Home/Page1.jsx
+++ b/site/theme/template/Home/Page1.jsx
@@ -21,9 +21,11 @@ export default function Page1() {
   return (
     <ScrollOverPack scrollName="page1" className="content-wrapper page" playScale={1} replay scrollEvent={onScrollEvent}>
       <TweenOne key="image" className="image1 image-wrapper" animation={{ x: 0, opacity: 1, duration: 550 }}
-        style={{ transform: 'translateX(-100px)', opacity: 0 }} hideProps={{ reverse: true }} />
+        style={{ transform: 'translateX(-100px)', opacity: 0 }} hideProps={{ reverse: true }}
+      />
       <QueueAnim className="text-wrapper" delay={300} key="text" duration={550} leaveReverse
-        hideProps={{ child: null }}>
+        hideProps={{ child: null }}
+      >
         <h2 key="h2">最佳实践</h2>
         <p key="p" style={{ maxWidth: 310 }}>近一年的中后台设计实践，积累了大量的优秀案例。</p>
         <div key="button">
diff --git a/site/theme/template/Home/Page2.jsx b/site/theme/template/Home/Page2.jsx
index 2f770e2e7a..2d140dcae0 100644
--- a/site/theme/template/Home/Page2.jsx
+++ b/site/theme/template/Home/Page2.jsx
@@ -10,7 +10,8 @@ export default function Page2() {
     <ScrollOverPack scrollName="page2" className="content-wrapper page" playScale={1} replay>
       <QueueAnim className="text-wrapper left-text" delay={300} key="text" duration={550} type="bottom"
         leaveReverse
-        hideProps={{ child: null }}>
+        hideProps={{ child: null }}
+      >
         <h2 key="h2">设计模式</h2>
         <p key="p" style={{ maxWidth: 260 }}>总结中后台设计中反复出现的问题，并提供相应的解决方案。</p>
         <div key="button">
@@ -23,7 +24,8 @@ export default function Page2() {
         </div>
       </QueueAnim>
       <TweenOne key="image" className="image2 image-wrapper" animation={{ x: 0, opacity: 1, delay: 300, duration: 550 }}
-        style={{ transform: 'translateX(100px)', opacity: 0 }} hideProps={{ reverse: true }} />
+        style={{ transform: 'translateX(100px)', opacity: 0 }} hideProps={{ reverse: true }}
+      />
     </ScrollOverPack>
   );
 }
diff --git a/site/theme/template/Home/Page3.jsx b/site/theme/template/Home/Page3.jsx
index 2e50d6e0f5..1a3f5b323b 100644
--- a/site/theme/template/Home/Page3.jsx
+++ b/site/theme/template/Home/Page3.jsx
@@ -9,9 +9,11 @@ export default function Page3() {
   return (
     <ScrollOverPack scrollName="page3" className="content-wrapper page" playScale={1} replay>
       <TweenOne key="image" className="image3 image-wrapper" animation={{ x: 0, opacity: 1, duration: 550 }}
-        style={{ transform: 'translateX(-100px)', opacity: 0 }} hideProps={{ reverse: true }} />
+        style={{ transform: 'translateX(-100px)', opacity: 0 }} hideProps={{ reverse: true }}
+      />
       <QueueAnim className="text-wrapper" delay={300} key="text" duration={550} leaveReverse style={{ top: '40%' }}
-        hideProps={{ child: null }}>
+        hideProps={{ child: null }}
+      >
         <h2 key="h2">丰富的基础组件</h2>
         <p key="p" style={{ maxWidth: 280 }}>丰富、灵活、实用的基础组件，为业务产品提供强有力的设计支持。</p>
         <div key="button">
diff --git a/site/theme/template/Home/Page4.jsx b/site/theme/template/Home/Page4.jsx
index 3baacbee26..f16f32493e 100644
--- a/site/theme/template/Home/Page4.jsx
+++ b/site/theme/template/Home/Page4.jsx
@@ -7,12 +7,14 @@ export default function Page4() {
   return (
     <ScrollOverPack scrollName="page4" className="content-wrapper page" playScale={1}>
       <QueueAnim className="text-wrapper-bottom" delay={300} key="text" duration={550} leaveReverse type="bottom"
-        hideProps={{ child: null }}>
+        hideProps={{ child: null }}
+      >
         <h2 key="h2">微小·确定·幸福</h2>
         <p key="p">这是一套致力于提升『用户』和『设计者』使用体验的中后台设计语言。</p>
       </QueueAnim>
       <TweenOne key="image" className="image4 bottom-wrapper" animation={{ y: 0, opacity: 1, duration: 550, delay: 550 }}
-        style={{ transform: 'translateY(50px)', opacity: 0 }} hideProps={{ reverse: true }} />
+        style={{ transform: 'translateY(50px)', opacity: 0 }} hideProps={{ reverse: true }}
+      />
     </ScrollOverPack>
   );
 }
diff --git a/site/theme/template/Layout/Footer.jsx b/site/theme/template/Layout/Footer.jsx
index 84e2216cde..5486575e96 100644
--- a/site/theme/template/Layout/Footer.jsx
+++ b/site/theme/template/Layout/Footer.jsx
@@ -110,7 +110,8 @@ export default class Footer extends React.Component {
                 size="small"
                 dropdownMatchSelectWidth={false}
                 defaultValue={antdVersion}
-                onChange={this.handleVersionChange}>
+                onChange={this.handleVersionChange}
+              >
                 {options}
               </Select>
             </div>
diff --git a/site/theme/template/Layout/Header.jsx b/site/theme/template/Layout/Header.jsx
index bc9266e623..256971c83b 100644
--- a/site/theme/template/Layout/Header.jsx
+++ b/site/theme/template/Layout/Header.jsx
@@ -136,14 +136,16 @@ export default class Header extends React.Component {
             <Icon
               className="nav-phone-icon"
               onClick={this.handleMenuIconClick}
-              type="menu" />
+              type="menu"
+            />
             <Link to="/" id="logo">
               <img alt="logo" src="https://t.alipayobjects.com/images/rmsweb/T1B9hfXcdvXXXXXXXX.svg" />
               <span>Ant Design</span>
             </Link>
           </Col>
           <Col className={`nav ${this.state.menuVisible ? 'nav-show' : 'nav-hide'}`}
-            lg={20} md={18} sm={17} xs={0} style={menuStyle}>
+            lg={20} md={18} sm={17} xs={0} style={menuStyle}
+          >
             <div id="search-box">
               <Select combobox
                 dropdownClassName="component-select"
@@ -151,7 +153,8 @@ export default class Header extends React.Component {
                 value={undefined}
                 optionFilterProp="data-label"
                 filterOption={this.handleSelectFilter}
-                onSelect={this.handleSearch}>
+                onSelect={this.handleSearch}
+              >
                 {options}
               </Select>
             </div>
diff --git a/site/theme/template/NotFound.jsx b/site/theme/template/NotFound.jsx
index 43fcf8f2b0..7c2dbdf059 100644
--- a/site/theme/template/NotFound.jsx
+++ b/site/theme/template/NotFound.jsx
@@ -10,7 +10,8 @@ export default function NotFound() {
       </section>
       <style dangerouslySetInnerHTML={{
         __html: '#react-content { height: 100%; background-color: #fff }',
-      }} />
+      }}
+      />
     </div>
   );
 }
diff --git a/tests/layout.test.js b/tests/layout.test.js
index 32a0a6e816..22b1c5c93d 100644
--- a/tests/layout.test.js
+++ b/tests/layout.test.js
@@ -15,13 +15,13 @@ describe('Layout', function() {
       <Col span="2"></Col>
     );
     const colNode = TestUtils.findRenderedDOMComponentWithTag(col, 'DIV');
-    expect(colNode.className).toBe('col-2');
+    expect(colNode.className).toBe('ant-col-2');
   });
   it('should render Row', () => {
     const row = TestUtils.renderIntoDocument(
       <Row></Row>
     );
     const rowNode = TestUtils.findRenderedDOMComponentWithTag(row, 'DIV');
-    expect(rowNode.className).toBe('row');
+    expect(rowNode.className).toBe('ant-row');
   });
 });