0

我有一个 asp.net 网格视图。我已经使用阴影将样式应用于主标题栏。这在 IE9 中运行良好,但它不使用 Chrome 中的阴影。我在我的 web 应用程序中对 div 等使用完全相同的阴影,Chrome 和 IE9 都可以正常工作。那么为什么 Chrome 不喜欢我的 CSS 呢?(特别是 .mGrid 中的 3 条阴影线如下所示)

谢谢达摩

HTML 代码

<asp:GridView ID="GridViewMain" OnRowDataBound="RowDataBound" OnPageIndexChanging="gridView_PageIndexChanging"
                                        runat="server"  AllowPaging="True" PageSize="50" PagerSettings-Position="TopAndBottom"
                                        CssClass="mGrid"
                                        PagerStyle-CssClass="pgr"
                                        AlternatingRowStyle-CssClass="alt"
                                        >
                                     </asp:GridView>

CSS

/* Grids */

.mGrid { width: 100%; background-color: #fff; margin: 5px 0 10px 0; border: solid 1px #525252; border-collapse:collapse;font-family:Verdana; font-size:12px; }

.mGrid td { padding: 2px; border: solid 1px #c1c1c1; color: #003366; }

.mGrid th { padding: 4px 2px; color: #000000; 
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#99CCFF'); /* for IE */
            background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#9CF)); /* for webkit browsers */
            background: -moz-linear-gradient(top,  #FFF,  #9CF); /* for firefox 3.6+ */
            background: #99CCFF; font-size: 0.9em;border: solid 2px #c1c1c1;         
          }

.mGrid .alt { background: #fcfcfc; }

.mGrid .pgr {background: #FFFFFF; }

.mGrid .pgr table { margin: 5px 0; }

.mGrid .pgr td { border-width: 0px; padding: 0 6px; border-left: solid 1px #666; font-weight: bold; color: #fff; line-height: 12px; }  

.mGrid .pgr a { color: #666; text-decoration: none; }

.mGrid .pgr a:hover { color: #000; text-decoration: none; }

.mGrid tr:hover{background-color:#FFFFCC;color:white;}

/* End Grids */
4

2 回答 2

1

你可以使用以下样式,

   /***** data table ******/
.dataTable{ display:table; margin:0px 0px 3px 0px; padding:0px; border: none;  border-spacing:0px; font-size:100%;   }
.noPad{ padding:0px !important; margin:0px !important;}
.dataTable tr.altRow td{ background:#EAEAEA ;}
.dataTable tr.selRow td{ background:#FFFFCC ;}
.dataTable td.middleAlign{ padding:11px !important; }
.dataTable tr.totalRow td{ background:#999999 !important;}
.dataTable th{ background: url('/_layouts/ABFSG/MF/Images/tableHdr_bg.png') left top repeat-x; margin:0px; font-size:12px; color:#000;  border-top:0px solid #D7BB00; vertical-align:middle !important; }
.dataTable th, td{ display:table-cell; padding:5px 5px 5px 7px; border:0px solid #cecece; vertical-align:middle;text-align:left; font-weight:normal;}
.dataTable td.subRow { border-top:1px solid #D7BB00;background: url('/_layouts/ABFSG/MF/Images/subRowHeader.png') left top repeat-x; height:17px; padding:2px !important; padding-left:7px !important; }
.dataTable tr.singleRow td{ padding:0px 5px 3px 5px !important;}
.withBorder td{ border:1px solid #EAEAEA;}
.dataTable td.gray{ background-color:#818181;}
.dataTable td.noPadDiv{ padding:0px !important; margin:0px !important;}
.dataTable td.vtop{  vertical-align:top;}

.sec_dataTable{display:table; margin:0px 0px 3px 0px; padding:0px; border: none;  border-spacing:0px; font-size:100%;}
.sec_dataTable tr th{background:#FFFAEA ; margin:0px; font-size:11px; color:#000;  display:table-cell; padding:5px 5px 5px 7px; border:1px solid #DDDDDD; vertical-align:middle; text-align:left; font-weight:normal;}
.sec_dataTable tr td{ display:table-cell; padding:5px 5px 5px 7px; border:1px solid #DDDDDD; vertical-align:middle; text-align:left; font-weight:normal;}
.sec_dataTable tr.altRow td{ background:#EAEAEA !important;}

.dataTableBrd{display:table; margin:0px 0px 3px 0px; padding:0px; border: none;  border-spacing:0px; font-size:100%;}
.dataTableBrd tr th{ background: url('/_layouts/ABFSG/MF/Images/tableHdr_bg.png') left top repeat-x;border:1px solid #EBBA05; margin:0px; font-size:11px; color:#000;padding:5px 5px 5px 7px;  border-top:0px solid #D7BB00; vertical-align:middle !important; font-weight:normal;}
.dataTableBrd tr td{ display:table-cell; padding:5px 5px 5px 7px; border:1px solid #DDDDDD; vertical-align:middle; text-align:left; font-weight:normal;}
.dataTableBrd tr.altRow td{ background:#EAEAEA !important;}


.globalNav{background:url(/_layouts/ABFSG/MF/Images/globalNav_bg.png) left top repeat-x; margin:0px; padding:0px; height:22px; float:left;}
.globalNav ul{ margin:0px; padding:0px; list-style:none;}
.globalNav li{ float:left;}
.globalNav li a{ display:block; font-family: Verdana, Arial, Helvetica, sans-serif; font-size:11px; color:#000; margin:0px; padding:4px 10px 4px 10px;}
.globalNav li.sep{ display:block; background:url('/_layouts/ABFSG/MF/Images/globalNav_sep.png') left top no-repeat; width:1px; height:22px;}
.globalNav li.sel a{ display:block; background:url(/_layouts/ABFSG/MF/Images/globalNav_selbg.png) top left repeat-x; font-family: Verdana, Arial, Helvetica, sans-serif; font-size:11px; color:#FECB02;}
.globalNav li.sel a:hover{ cursor:default;}
.globalNav li.first{ float:left; background:url(/_layouts/ABFSG/MF/Images/globalNav_unselFirL.png) left top no-repeat; margin:0px; padding:0px;}
.globalNav li.first a{ display:block; font-family: Verdana, Arial, Helvetica, sans-serif; font-size:11px; color:#000; margin:0px; padding:4px 10px 4px 10px;}
.globalNav li.firstsel{ float:left; background:url(/_layouts/ABFSG/MF/Images/globalNav_selFirL.png) left top no-repeat; margin:0px; padding:0px;}
.globalNav li.firstsel a{ display:block; background:url(/_layouts/ABFSG/MF/Images/globalNav_selbg.png) top left repeat-x; font-family: Verdana, Arial, Helvetica, sans-serif; font-size:11px; color:#FECB02; margin:0px 0px 0px 5px; padding:4px 10px 4px 5px;}
.globalNav li.firstsel a:hover{ cursor:default;}
.globalNav li.last{ float:left; background:url(/_layouts/ABFSG/MF/Images/globalNav_unselLastL.png) right top no-repeat; margin:0px; padding:0px;}
.globalNav li.last a{ display:block; font-family: Verdana, Arial, Helvetica, sans-serif; font-size:11px; color:#000; margin:0px; padding:4px 10px 4px 10px;}
.globalNav li.lastsel{ float:left; background:url(/_layouts/ABFSG/MF/Images/globalNav_selLastL.png) right top no-repeat; margin:0px; padding:0px;}
.globalNav li.lastsel a{ display:block; background:url(/_layouts/ABFSG/MF/Images/globalNav_selbg.png) top left repeat-x; font-family: Verdana, Arial, Helvetica, sans-serif; font-size:11px; color:#FECB02; margin:0px 4px 0px 0px; padding:4px 5px 4px 10px;}
.globalNav li.lastsel a:hover{ cursor:default;}

.grayNav ul{ margin:0px; padding:0px;}
.grayNav li{ float:left; list-style:none;}
.grayNav li a{ display:block; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; color:#6c7f85; margin:0px; padding:0px 2px; }
.grayNav li.sel a{ display:block; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; color:#000; margin:0px; padding:0px 2px; }
.grayNav li.sel a:hover{ cursor:default; }
.grayNav li.sep{ color:#C8C8C8; font-weight:bold; margin:0 7px 0 7px;}

.header h1{ font-size:15px; color:#000; font-weight:bold; float:left;}
.btnSearchTopPad{ margin-top:0px; *margin-top:1px;}

.arrowPlace{position:absolute; margin-top:-7px;}
.solutionTxt{ padding:5px 0px; width:100%;width:97%\9; text-align:center; color:#000!important; float:left;}
.blkLinkText{ padding:5px 0px; width:100%;width:97%\9; color:#000!important; float:left;}
.largeFont{ font-size:15px; font-weight:bold;}
/*.pagination_bg{background:#D0D0D0; float:left; -moz-border-radius: 3px;-webkit-border-radius: 3px;}*/
.pagination_sel{ padding:2px 5px; float:left;}
.pagination_sel a{  cursor:default;}
.pagination_unsel{ padding:2px 5px; float:left;}

.testimonialBox{ background: #fff url(/_layouts/ABFSG/MF/Images/header_boxBG.png) bottom left repeat-x;}
.testimonialBoxShadow{ background: #fff url(/_layouts/ABFSG/MF/Images/header_boxSDO.png) center no-repeat; height: 10px;}

.testimonial{ position:relative; border:1px solid #9F9F9F; padding:0px!important; float:left; border-left:none; border-top:none; border-bottom:none;}
.testimonialCont{position:absolute; height: 18px; width: 18px; background-position: -47px 0px;}
.testimonial .bdrT{ background:url('/_layouts/ABFSG/MF/Images/testmonial_Top.png') left top repeat-x; margin-left:25px; padding:3px 0 0 0; font-size:3px;}
.testimonial .bdrB{ background:url('/_layouts/ABFSG/MF/Images/testmonial_Top.png') left top repeat-x;  margin-left:25px; padding:0 0 3px 0; height:1px; }
.testimonial .bdrL{background: url("/_layouts/ABFSG/MF/Images/testmonial_Aro.png") no-repeat scroll left center transparent; margin: 0;padding: 0 0 0 22px;}
.tmTL{top: -2px; left:19px; clip: rect(auto 8px 8px auto);}
.tmTR{top: -2px; right: -5px; clip: rect(auto auto 8px 8px); float: right;}
.tmBL{bottom: -1px;left: 19px; clip: rect(8px 8px auto auto); }
.tmBR{bottom: -1px;right: -5px;clip: rect(8px auto auto 8px); }

.os_banner1{ margin-left:-10px; padding:103px 0px 4px 0px; background:url(/_layouts/ABFSG/MF/Images/our_solutions_banner1.png) left top no-repeat; width:454px; height:115px;}
.os_banner2{ margin:-4px 0px 0px -10px; padding:103px 0px 4px 0px; background:url(/_layouts/ABFSG/MF/Images/ourSolutions_banner2.jpg) left top no-repeat; width:452; height:111px; width: 456px;}

.os_banner_grp{ margin:-4px 0px 0px -10px; padding:103px 0px 0px 0px; background:url(/_layouts/ABFSG/MF/Images/group_oursolutions.png) left top no-repeat; width:452; height:115px; width: 456px;}
.banner1Cont{ margin:-70px 0 0 250px;}
.banner2Cont{ margin:-80px 0 0 205px;}
h1.privaFont{font-size:16px; color:#000; font-family:PrivaThreeItalicPro,Verdana, Arial; letter-spacing:-1px;}
.os_bannerBG{ background: url(/_layouts/ABFSG/MF/Images/our_solutions_bg.png) top left repeat-x; padding:7px; height:92px; width:442px;}

.headerBox_smallShadow{ background: #fff url(/_layouts/ABFSG/MF/Images/header_box_smallSDO.png) center top no-repeat; height:6px; padding:0px; margin:0px; float:left;}

#wealth_layer,#fundsLayer,#orgFundsLayer,#rollOver1,#rollOver2,#wealthPro_layer,#adityaB_layer,#mutual_layer,#Purchase_step1,#equity,#funds{padding-top:10px;   position:absolute; display:none; z-index:10;}

.portlet_01 .bdrRt{background-image:url(/_layouts/ABFSG/MF/Images/purple_dropdwn_right.png);background-position:right 5px; background-repeat:no-repeat; margin-bottom:0px;}
.portlet_01 .bdrLt{background-image:url(/_layouts/ABFSG/MF/Images/purple_dropdwn_left.png);background-position:left 5px; background-repeat:no-repeat; margin-bottom:0px;}

.borderBottHeader{ border-bottom:1px solid #D6D6D6; width:449px; margin-left:3px; margin-top:-0px; *margin-top:-10px;}

.moverArr{background-image:url(/_layouts/ABFSG/MF/Images/solutionSelArr.png); background-position:absolute;  height:9px;                width:113px;  margin-top:-8px; *margin-top:-8px; margin-left:5px; z-index:99;}

#breadCrumbs a{ font-weight:bold;}
.star_icon{width:16px; height:15px; background-image:url('/_layouts/ABFSG/MF/Images/sprite_icon.png'); background-position:-34px -113px; background-repeat:no-repeat; padding:0px;}
.ratingFull_icon{width:10px; height:11px; background-image:url('/_layouts/ABFSG/MF/Images/sprite_icon.png'); background-position:-54px -113px; background-repeat:no-repeat; padding:0px;}
.ratingHalf_icon{width:9px; height:11px; background-image:url('/_layouts/ABFSG/MF/Images/sprite_icon.png'); background-position:-67px -113px; background-repeat:no-repeat; padding:0px;}
.returns_icon{width:17px; height:15px; background-image:url('/_layouts/ABFSG/MF/Images/sprite_icon.png'); background-position:-81px -116px; background-repeat:no-repeat; padding:0px;}
.risk_icon{width:18px; height:17px; background-image:url('/_layouts/ABFSG/MF/Images/sprite_icon.png'); background-position:-101px -116px; background-repeat:no-repeat; padding:0px;}
.liquidity_icon{width:16px; height:18px; background-image:url('/_layouts/ABFSG/MF/Images/sprite_icon.png'); background-position:-122px -116px; background-repeat:no-repeat; padding:0px;}
.investment_icon{width:16px; height:17px; background-image:url('/_layouts/ABFSG/MF/Images/sprite_icon.png'); background-position:-143px -116px; background-repeat:no-repeat; padding:0px;}
.awards_icon{width:15px; height:20px; background-image:url('/_layouts/ABFSG/MF/Images/sprite_icon.png'); background-position:-167px -113px; background-repeat:no-repeat; padding:0px;}
.vr_icon{width:12px; height:10px; background-image:url('/_layouts/ABFSG/MF/Images/sprite_icon.png'); background-position:-189px -118px; background-repeat:no-repeat; padding:0px;}
.botBrdr{ border-top:1px solid #FFDD00; height:0px; border-bottom:1px solid #FFF; margin:0 0px 0 -10px; padding-right:20px;}


.lightYellowBox{border: 1px solid #F6E04E; position:relative; overflow:visible;background-color:#FEFCE5;background-image:none;}
.type7 .yellowBxCrnr{background-image:url(/_layouts/ABFSG/MF/Images/sprite_icon.png);}                
.yellowBxCrnr { position:absolute; height: 12px; width: 12px; background-position:-68px 0px;}
.YTL{position: absolute;left: -1px; top: -1px; clip: rect(0 6px 6px 0);}
.YTR {position: absolute;top: -1px; right: -1px; clip: rect(auto auto 6px 6px); float: right;}
.YBL {position: absolute;clip:  rect(6px 6px auto auto);left: -1px; bottom: -1px;_bottom: -3px;}
.YBR  { position: absolute; clip: rect(6px auto auto 6px);bottom: -1px;right: -1px;_bottom: -3px;}

.fundDetailsBg{ margin:0px 0px 0px 7px; padding:40px 10px 0px 350px; background:url(/_layouts/ABFSG/MF/Images/fund_details.png) left top no-repeat; width:320px; height:118px;  }
.gratuityDetailsBg{ margin:0px; padding:40px 0px 0px 350px; background:url(/_layouts/ABFSG/MF/Images/oursolutions_gratuity.png) left top no-repeat; width:330px; height:90px; font-size:20px;}

.fundDetailsMFBg{ margin:0px; padding:40px 0px 4px 340px; background:url(/_layouts/ABFSG/MF/Images/fund_details.gif) left top no-repeat; width:330px; height:138px; }

.fundDetailsCorporateBg{  margin:0px; padding:40px 0px 4px 0px; background:url(/_layouts/ABFSG/MF/Images/Corporatefunddetailsoverview_img.jpg) left top no-repeat; width:670px; height:145px;}
.shadowSep{background:url(/_layouts/ABFSG/MF/Images/shadowSep.png) left top no-repeat; width:680px; height:9px;}
.marginNeg{margin-left:-5px; margin-right:-2px;}

div.greyTab{background:url('/_layouts/ABFSG/MF/Images/button_sprite.png') left no-repeat;overflow: hidden;         height: 24px;padding-left: 10px;margin-right: 0px;           float:left;             background-position:0px -124px; z-index:1000; }
a:hover.greyTab{text-decoration:none}
a.greyTab { display:block; background:url('/_layouts/ABFSG/MF/Images/button_sprite.png') right no-repeat ;   padding: 5px 23px 5px 5px;            margin-right: 0px;height: 24px;  float:left;             color: #000;         background-position: right -124px;}

#contentBox{ position:absolute; left:264px; left:260px\9; top:256px; float:left; z-index:1001;}
#searchNAVBox{ position:relative;  float:left;}

.borderBottom{ border-bottom:1px solid #acacaa; margin-left:3px; margin-top:-0px; *margin-top:-10px; padding-bottom:10px;}
.greyBox{ background-color:#EAEAEA; border-top:1px solid #acacaa; border-bottom:1px solid #acacaa; padding:10px; margin-left:-10px; padding-left:10px;width:671px;}
.whtBox{ background-color:#fff; padding:10px; margin-left:-10px; padding-left:10px; width:671px;}
.whiteBox_01{padding-bottom:10px; margin-left:-10px; padding-left:10px; background:#ffffff;}

#curtain{ width:100%; height:100%; position: absolute; z-index:995 !important; overflow:hidden; left:0px; top:0px; opacity:.4; filter: alpha(opacity=60); background-color: #000;}
.popupAlign{position:absolute; left:50%; top:20%; z-index:999 !important;}

.closeBtn{width:17px; height:17px; background-image:url('/_layouts/ABFSG/MF/Images/sprite_icon.png'); background-position:-137px 0px; background-repeat:no-repeat; padding:0px; `enter code here`margin-top:-3px; margin-right:-5px; cursor:pointer;}
于 2013-05-03T05:55:16.233 回答
0

需要放线

background: #99CCFF; font-size: 0.9em;border: solid 2px #c1c1c1; 

在应用阴影之前。如下所示。现在修复了。谢谢达摩

.mGrid th { padding: 4px 2px; color: #000000;
             **background: #99CCFF; font-size: 0.9em;border: solid 2px #c1c1c1;**  
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#99CCFF'); /* for IE */
            background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#9CF)); /* for webkit browsers */
            background: -moz-linear-gradient(top,  #FFF,  #9CF); /* for firefox 3.6+ */

          }
于 2012-09-06T21:19:39.180 回答