成都网站建设设计

将想法与焦点和您一起共享

Bootstrap实现表格样式、表单布局的实例代码

1. 表格的一些样式

创新互联是一家网站设计、网站建设,提供网页设计,网站设计,网站制作,建网站,定制网站开发,网站开发公司,于2013年开始是互联行业建设者,服务者。以提升客户品牌价值为核心业务,全程参与项目的网站策划设计制作,前端开发,后台程序制作以及后期项目运营并提出专业建议和思路。

Bootstrap 实现表格样式、表单布局的实例代码

举例:





My Test bootstrap
   
  


 
这是一个测试表格
姓名 年龄 地区
小胡子 26 陕西
大胡子 26 北京

页面效果:

Bootstrap 实现表格样式、表单布局的实例代码

2. 表格行或单元格的样式

Bootstrap 实现表格样式、表单布局的实例代码

举例:





My Test bootstrap
   
  


 
这是一个测试表格
姓名 年龄 地区
小胡子 26 陕西
大胡子 26 北京

页面效果:

Bootstrap 实现表格样式、表单布局的实例代码

3. 表单布局

(1)垂直表单:





My Test bootstrap
   
  


效果:

Bootstrap 实现表格样式、表单布局的实例代码

(2)内联表单:它的所有元素是内联的,向左对齐的,标签是并排的





My Test bootstrap
   
  


效果:

Bootstrap 实现表格样式、表单布局的实例代码

(3)水平表单:水平表单与其他表单不仅标记的数量上不同,而且表单的呈现形式也不同





My Test bootstrap
   
  


效果:

Bootstrap 实现表格样式、表单布局的实例代码

总结

以上所述是小编给大家介绍的Bootstrap 实现表格样式、表单布局的实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对创新互联网站的支持!


文章标题:Bootstrap实现表格样式、表单布局的实例代码
当前路径:http://chengdu.cdxwcx.cn/article/psohec.html