Bootstrap表在Jsfiddle React代码中无法正确显示

沙爹G

在Jsfiddle的示例React应用程序中,Bootstrap表未正确显示。是的,我在JSX中使用的是className而不是class。请提出代码中的错误。

链接到代码:https : //jsfiddle.net/hgondela/teag0sqf/5/

var HelloTable = React.createClass({
  render: function() {
    return (  
        <div> 
          <div className='jumbotron  text-center'>Bootstrap table in React JSX </div> 
            <table className="table table-striped table-bordered">
              <tr>
                <th>Firstname</th>
                <th>Lastname</th> 
                <th>Age</th>
              </tr>
              <tr>
                <td>Jill</td>
                <td>Smith</td> 
                <td>50</td>
              </tr>
              <tr>
                <td>Eve</td>
                <td>Jackson</td> 
                <td>94</td>
              </tr>
            </table>    
      </div>
    )
  }    
})

ReactDOM.render(<HelloTable name="World" />, document.getElementById('container'));
保罗·伯格

我用浏览器检查了jsfiddle中的元素,发现浏览器会自动<tbody>在表中插入一个元素,该元素将引导程序用于样式的包装。所以我加了<tbody>

<table>
  <tbody>
    // table stuff
  </tbody>
</table>

现在表格看起来很棒:https : //jsfiddle.net/teag0sqf/6/

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

Bootstrap表边框在Firefox中无法正确显示

来自分类Dev

jsfiddle中的bootstrap Accordian示例

来自分类Dev

Bootstrap列在Firefox中无法正确显示

来自分类Dev

Bootstrap Select在Chrome中无法正确显示

来自分类Dev

Bootstrap列在Firefox中无法正确显示

来自分类Dev

Bootstrap Popover 中的 MathJax 无法正确显示

来自分类Dev

无法在PHP中显示正确的表

来自分类Dev

react-bootstrap网格布局无法正确显示

来自分类Dev

<table />中的Bootstrap-datetimepicker无法正确显示

来自分类Dev

Bootstrap表单仅在Firefox中无法正确显示

来自分类Dev

Bootstrap 按钮颜色不起作用,但在 jsfiddle 中工作

来自分类Dev

在Ember / Rails应用程序中开发加载程序CSS元素。它将在Codepen / jsfiddle中正确显示,但在实际应用程序中无法正确显示。

来自分类Dev

Bootstrap表如何隐藏,使用JavaScript切换可见时无法正确显示

来自分类Dev

无法使用添加行按钮将行添加到jsfiddle中的HTML表中

来自分类Dev

无法使用添加行按钮将行添加到jsfiddle中的HTML表中

来自分类Dev

Bootstrap3 Navs无法正确显示

来自分类Dev

Bootstrap导航栏无法正确显示

来自分类Dev

Bootstrap DateTimePicker样式无法正确显示

来自分类Dev

Django Admin表无法正确显示

来自分类Dev

Moodle中的Bootstrap表

来自分类Dev

无法从代码插入中间表,但在 MySQL 中从 phpmyadmin 执行时,它正确插入

来自分类Dev

小册子地图在Bootstrap 3.0模式中无法正确显示

来自分类Dev

Bootstrap模式样式的位置固定关闭按钮在Internet Explorer中无法正确显示

来自分类Dev

DatePicker在Bootstrap ASP.NET MVC 5中无法正确显示

来自分类Dev

Bootstrap下拉菜单在Google Chrome中无法正确显示

来自分类Dev

小册子地图在Bootstrap 3.0模态中无法正确显示

来自分类Dev

DatePicker在Bootstrap ASP.NET MVC 5中无法正确显示

来自分类Dev

如何在Wordpress中显示来自Jsfiddle或Github的代码?

来自分类Dev

重新加载表或弹出视图时,无法正确显示UITableViewCell中的UIImage覆盖

Related 相关文章

  1. 1

    Bootstrap表边框在Firefox中无法正确显示

  2. 2

    jsfiddle中的bootstrap Accordian示例

  3. 3

    Bootstrap列在Firefox中无法正确显示

  4. 4

    Bootstrap Select在Chrome中无法正确显示

  5. 5

    Bootstrap列在Firefox中无法正确显示

  6. 6

    Bootstrap Popover 中的 MathJax 无法正确显示

  7. 7

    无法在PHP中显示正确的表

  8. 8

    react-bootstrap网格布局无法正确显示

  9. 9

    <table />中的Bootstrap-datetimepicker无法正确显示

  10. 10

    Bootstrap表单仅在Firefox中无法正确显示

  11. 11

    Bootstrap 按钮颜色不起作用,但在 jsfiddle 中工作

  12. 12

    在Ember / Rails应用程序中开发加载程序CSS元素。它将在Codepen / jsfiddle中正确显示,但在实际应用程序中无法正确显示。

  13. 13

    Bootstrap表如何隐藏,使用JavaScript切换可见时无法正确显示

  14. 14

    无法使用添加行按钮将行添加到jsfiddle中的HTML表中

  15. 15

    无法使用添加行按钮将行添加到jsfiddle中的HTML表中

  16. 16

    Bootstrap3 Navs无法正确显示

  17. 17

    Bootstrap导航栏无法正确显示

  18. 18

    Bootstrap DateTimePicker样式无法正确显示

  19. 19

    Django Admin表无法正确显示

  20. 20

    Moodle中的Bootstrap表

  21. 21

    无法从代码插入中间表,但在 MySQL 中从 phpmyadmin 执行时,它正确插入

  22. 22

    小册子地图在Bootstrap 3.0模式中无法正确显示

  23. 23

    Bootstrap模式样式的位置固定关闭按钮在Internet Explorer中无法正确显示

  24. 24

    DatePicker在Bootstrap ASP.NET MVC 5中无法正确显示

  25. 25

    Bootstrap下拉菜单在Google Chrome中无法正确显示

  26. 26

    小册子地图在Bootstrap 3.0模态中无法正确显示

  27. 27

    DatePicker在Bootstrap ASP.NET MVC 5中无法正确显示

  28. 28

    如何在Wordpress中显示来自Jsfiddle或Github的代码?

  29. 29

    重新加载表或弹出视图时,无法正确显示UITableViewCell中的UIImage覆盖

热门标签

归档