diff --git a/src/case/segment/button.segment.js b/src/case/segment/button.segment.js
index 0e3ac343b..2d9d6c19a 100644
--- a/src/case/segment/button.segment.js
+++ b/src/case/segment/button.segment.js
@@ -10,7 +10,7 @@ BI.SegmentButton = BI.inherit(BI.BasicButton, {
     _defaultConfig: function () {
         var conf = BI.SegmentButton.superclass._defaultConfig.apply(this, arguments);
         return BI.extend(conf, {
-            baseCls: (conf.baseCls || "") + " bi-segment-button bi-list-item-select",
+            baseCls: (conf.baseCls || "") + " bi-segment-button bi-list-item-select bi-card",
             shadow: true,
             readonly: true,
             hgap: 5
diff --git a/src/less/base/segment/segment.less b/src/less/base/segment/segment.less
index 7796d85af..817c6cd3e 100644
--- a/src/less/base/segment/segment.less
+++ b/src/less/base/segment/segment.less
@@ -3,7 +3,6 @@
 .bi-segment{
   & > .center-element{
     .overflow-hidden();
-    background: @color-bi-background-default;
     border-right: 1px solid @color-bi-border-highlight;
     border-top: 1px solid @color-bi-border-highlight;
     border-bottom: 1px solid @color-bi-border-highlight;
@@ -24,7 +23,6 @@
   .bi-segment {
     & > .center-element{
       .overflow-hidden();
-      background: @color-bi-background-default-theme-dark;
       border-right: 1px solid @color-bi-border-line-theme-dark;
       border-top: 1px solid @color-bi-border-line-theme-dark;
       border-bottom: 1px solid @color-bi-border-line-theme-dark;