jqGrid是使用jQuery編寫的基于Ajax的JavaScript表格插件。它的默認CSS樣式提供了非常好的視覺效果和交互功能。下面我們來了解一下jqGrid中的默認CSS樣式。

.ui-jqgrid {
position: relative;
width: 99%;
overflow: auto;
margin: 0px;
padding: 0px;
direction: ltr;
}

我們可以看到，jqGrid的外層DIV使用了一個名為“ui-jqgrid”的類名。這個類名定義了表格的一些基本樣式，如位置、寬度、溢出、邊距和內邊距等。

.ui-jqgrid-view {
position: relative;
overflow: hidden;
margin: 0px;
padding: 0px;
zoom: 1;
}

下面是名為“ui-jqgrid-view”的類名，定義了表格的內部樣式。它也使用了很多基本的樣式，如位置、溢出、邊距和內邊距等。

.ui-jqgrid-htable {
width: 100%;
margin: 0px;
padding: 0px;
border-collapse: collapse;
border-spacing: 0px;
table-layout: fixed;
}

這里我們來看表格頭部的樣式，使用名為“ui-jqgrid-htable”的類名。它基本上只定義了表格的固定寬度和一些常規的表格樣式（如邊距、內邊距、邊框折疊和單元格間距等）。

.ui-jqgrid-btable {
width: 100%;
margin: 0px;
padding: 0px;
border-collapse: collapse;
border-spacing: 0px;
table-layout: fixed;
}

最后是我們的表格主體樣式，名為“ui-jqgrid-btable”的類名。它與表格頭部樣式類似，也定義了固定寬度和基本表格樣式。

總的來說，jqGrid中的默認CSS樣式確實非常好看和易于使用，它使我們能夠輕松地創建漂亮的表格。