材料设计精简版-数据表

📌 相关文章

📜 材料设计精简版-数据表

📅 最后修改于: 2020-10-22 05:56:56 🧑 作者: Mango

MDL提供了一系列CSS类，以应用各种预定义的视觉和行为增强功能并将表显示为数据表。下表列出了可用的类及其效果。

Sr.No.	Class Name & Description
1	mdl-data-table Identifies table as an MDL component and is required on table element.
2	mdl-js-data-table Sets basic MDL behavior to table and is required on table element.
3	mdl-data-table–selectable Sets all/individual selectable behavior (checkboxes) and is optional; goes on table element.
4	mdl-data-table__cell–non-numeric Sets text formatting to data cell and is optional; goes on both table header and table data cells.
5	(none) By default, sets the numeric formatting to header or data cell.

例

以下示例将帮助您理解使用mdl-data-table类显示数据表的方法。

mdl_data_tables.htm

现场演示


      
            
   
   
   
      
         
            Student
               Class Grade
         
         
         
            Mahesh Parashar
               VI A
            Rahul Sharma
               VI B
            Mohan Sood
               VI A

Student	Class	Grade
Mahesh Parashar	VI	A
Rahul Sharma	VI	B
Mohan Sood	VI	A

结果

验证结果。