diff --git a/components/datepicker/index.md b/components/datepicker/index.md
index 764a6618b8..1e2b4cfde5 100644
--- a/components/datepicker/index.md
+++ b/components/datepicker/index.md
@@ -35,6 +35,10 @@
 
 ## API
 
+```jsx
+<DatePicker value="2015-01-01" />
+```
+
 - **value** `string`
 
   初始值，如 `2015-01-01`。
diff --git a/static/style.css b/static/style.css
index 132ceeb199..603bd37da9 100644
--- a/static/style.css
+++ b/static/style.css
@@ -450,13 +450,12 @@ footer ul li > a {
   margin-left: 18px;
 }
 
-.markdown code {
-  background: #f6f6f6;
-  padding: 1px 6px;
-  border-radius: 3px;
-  color: #888;
-  font-size: 90%;
-  border: 1px solid #e9e9e9;
+.markdown pre {
+  margin: 15px 0;
+}
+
+.markdown pre code {
+  background: #fafafa;
 }
 
 #api ~ ul > li > p > strong ~ code {
@@ -1139,7 +1138,7 @@ footer ul li > a {
   color: #888;
   font-weight: bold;
   border-radius: 6px;
-  background: #F9F9F9;
+  background: #fafafa;
   box-shadow: 0 -1.2px 0 #e9e9e9;
 }
 
@@ -1183,8 +1182,8 @@ footer ul li > a {
 .code-box .highlight {
   overflow: hidden;
   display: none;
-  padding: 5px 15px;
-  border-top: 1px dashed #ddd;
+  padding: 5px;
+  border-top: 1px dashed #e9e9e9;
 }
 
 .code-box pre {
diff --git a/static/tomorrow.css b/static/tomorrow.css
index 57c5fbab04..438301543e 100644
--- a/static/tomorrow.css
+++ b/static/tomorrow.css
@@ -34,6 +34,15 @@
   color: #8959a8;
 }
 
+code {
+  background: #f6f6f6;
+  padding: 1px 6px;
+  border-radius: 3px;
+  color: #888;
+  font-size: 90%;
+  border: 1px solid #e9e9e9;
+}
+
 pre code {
   display: block;
   background: white;
@@ -41,7 +50,7 @@ pre code {
   font-family: Menlo, Monaco, Consolas, monospace;
   line-height: 1.5;
   border: 1px solid #e9e9e9;
-  padding: 8px 12px;
+  padding: 10px 15px;
   border-radius: 6px;
   font-size: 12px;
 }