Question

我在我的MVC3 w / razor项目中使用了Devexpress的MVC扩展。我有使用Devexpress的MVC扩展的数据网格，以及没有任何样式的基本html表。

有没有办法将devexpress样式应用到我的html表中以获得一致的外观？

Answer 1

您可以使用css为网格设置样式，然后对表执行相同的原则。这是我创建的网格样式，然后是类似表格的样式

/************************GRID STYLE************************************/
.mGrid
{
width: 100%;
background-color: #fff;
margin: 5px 0 5px 0;
border: solid 1px #525252;
border-collapse: collapse;
font-size: 13px; /*width: 820px;*/
text-align: center;
}
.mGrid td
{
padding: 2px;
border: solid 1px #c1c1c1; 
color: #717171;
height: 20px;
}
.mGrid th
{
padding: 4px 2px;
color: #fff;
background: #424242 url(images/grd_head.png) repeat-x top;
border-left: solid 1px #525252;
height: 20px; /*font-size: 15px; */
}
.mGrid .alt
{
background: #fcfcfc url(images/grd_alt.png) repeat-x top;
}
.mGrid .pgr
{
background: #424242 url(images/grd_pgr.png) repeat-x top;
text-align: left;
}
.mGrid .pgr table
{
margin: 5px 0;
}
.mGrid .pgr td
{
border-width: 0;
padding: 0 6px;
border-left: solid 1px #666;
font-weight: bold;
color: #fff;
line-height: 12px;
}
.mGrid .pgr a
{
color: #666;
text-decoration: none;
font-size: 13px;
}
.mGrid .pgr a:hover
{
color: #AED434;
text-decoration: none;
font-size: 13px;
}

/************************END GRID STYLE************************************/

/************************mGrid Table Look alike STYLE************************************/
 .mGridLookAlikeTable
{
width: 100%;
background-color: #fff;
margin: 5px 0 5px 0;
border: solid 1px #525252;
border-collapse: collapse;
font-size: 13px;
/*width: 820px;*/
text-align: center;
 }

 .mGridLookAlikeTable td
 {
padding: 2px;
border: solid 1px #c1c1c1;
color: #717171;
height: 20px;
 }
 .mGridLookAlikeTable th
 {
padding: 4px 2px;
color: #fff;
background: #424242 url(images/grd_head.png) repeat-x top;
border-left: solid 1px #525252;
height: 20px; /*font-size: 15px; */
 }

 /************************END mGrid Table Look alike STYLE************************************/

如何将Devexpress主题应用于基本的html表？

1 个答案: