1. 首頁
  2. 問答
  3. Asp.net的CSS Gridview造型

Asp.net的CSS Gridview造型

2012-09-06 56 views
0

我有一個asp.net gridview。我已使用陰影將樣式應用於主標題欄。 這在IE9中正常工作，但它不會在Chrome中使用陰影。我在我的web應用程序中使用完全相同的陰影等div和Chrome和IE9工作正常。 那麼爲什麼Chrome不喜歡我的CSS？ （具體地在.mGrid 3條陰影線th發如下所示）Asp.net的CSS Gridview造型

感謝 達莫

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 */

來源

2012-09-06 user1438082

回答

0

需要把線

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

應用陰影之前。如下所示。現在修好了。 感謝 DAMO

.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-06 21:19:39 user1438082

1

U可以使用下面的風格，

/***** 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-03 05:55:16 Mangal

相關問題

 相關問題