使用CSS / Angular JS修复了列和标题

时间:2014-10-07 12:12:30

标签: html css angularjs angularjs-directive

我无法实施以下内容:

  
      
  1. 修复表格的标题
  2.   
  3. 修复前4/5列冻结,其余列水平滚动
  4.   
  5. 该表应位于高度和宽度固定的div内
  6.   

我能够修复标题,我无法实现#2。该表位于页面上的窗格内。所以我不能真正使用position:absolute来修复列来实现#2。

我在网上试了几个例子来实现这一点,但我需要创建一个角度JS指令来做到这一点。我是AngularJS的新手,不过,我试图调整下面的例子,但没有运气。

https://www.pointblankdevelopment.com.au/blog/angularjs-fixed-header-scrollable-table-directive

任何有关CSS方式的帮助也会有所帮助。

我还为我想要做的事添加了plunker。所以我想冻结示例中的前两列。

http://plnkr.co/edit/iKwNrqT1Gy1oDvyK6FFN?p=preview

1 个答案:

答案 0 :(得分:-2)

如果您只是向thead添加更多行,它会自动为您修复它们,因为指令会调用。

见这里:http://embed.plnkr.co/CmJBfd/preview

因此,您所要做的就是在您的行上放置一个您不希望看起来像标题的自定义类,并将它们设置为像行一样的样式。