javascript - 拆分 HTML 表格以适合视口(viewport)宽度-6ren

javascript - 拆分 HTML 表格以适合视口(viewport)宽度

转载作者：可可西里更新时间：2023-11-01 14:45:30

我有一个包含很多列的 HTML 表格。我想像这样拆分表格以适应视口(viewport)宽度:

基本表

      | Column 1 | Column 2 | Column 3 | Column 4
------+----------+----------+----------+---------
Row 1 | (1,1)    | (1,2)    | (1,3)    | (1,4)
Row 2 | (2,1)    | (2,2)    | (2,3)    | (2,4)

我想要的东西

      | Column 1 | Column 2
------+----------+---------
Row 1 | (1,1)    | (1,2)
Row 2 | (2,1)    | (2,2)

      | Column 3 | Column 4
------+----------+---------
Row 1 | (1,3)    | (1,4)
Row 2 | (2,3)    | (2,4)

包含“X 行”和“X 列”的单元格是标题，我想将其保留在包装表中。

这是否可能使用 HTML/CSS/Javascript，以便响应式拆分表格？

编辑 1我的 HTML:

<table>
  <thead>
    <tr>
      <th></th>
      <th>Column 1</th>
      <th>Column 2</th>
      <th>Column 3</th>
      <th>Column 4</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th>Row 1</th>
      <td>(1,1)</td>
      <td>(1,2)</td>
      <td>(1,3)</td>
      <td>(1,4)</td>
    </tr>
    <tr>
      <th>Row 2</th>
      <td>(2,1)</td>
      <td>(2,2)</td>
      <td>(2,3)</td>
      <td>(2,4)</td>
    </tr>
  </tbody>

最佳答案

这是一个让您入门的 JS 解决方案。这个可以通过多种方式进行优化，您可以根据自己的元素要求采用它。总而言之，我喜欢快速破解这个小示例。

这是密码笔:http://codepen.io/anon/pen/RPLvyN . (水平调整屏幕大小以查看效果)。

    function FlexTable(el, container) {
      if(!(this instanceof FlexTable)) {
        return new FlexTable(el, container);
      }

      this.$el = $(el);
      this.$container = $(container);
      this.tables = [{
        $el: this.$el,
        columns: []
      }];
      this.getInfo();
      this.extractData();
      this.extractLabels();
      this.handleResizing();
      this.restructure();
    }

    FlexTable.prototype.getInfo = function() {
      this.columns = [];
      this.$el.find("thead th").each(function(key, el) {
        this.columns.push($(el).outerWidth());
      }.bind(this));
      this.tables[0].columns = this.columns.slice(1);
    };

    FlexTable.prototype.extractData = function() {
      this.data = [];
      this.rows = -1;
      $("tbody td").each(function(index, element) {
        if(index % (this.columns.length - 1) === 0) {
          this.data[++this.rows] = [];
        }
        this.data[this.rows].push($(element).text().trim());
      }.bind(this));
    };

    FlexTable.prototype.extractLabels = function() {
      this.columnLabels = [];
      this.rowLabels = [];

      this.$el.find("thead > tr > :nth-of-type(n + 2)").each(function(index, element) {
        this.columnLabels.push($(element).text().trim());
      }.bind(this)).end().find("tbody > tr > :first-child")
        .each(function(index, element) {
        this.rowLabels.push($(element).text().trim());    
      }.bind(this));
    };

    FlexTable.prototype.handleResizing = function() {
      this.$container.resize(function() {
        this.restructure();    
      }.bind(this));
    };

    FlexTable.prototype.availableSpace = function(flatten) {
      return flatten ? +Infinity : this.$container.outerWidth();
    };

    FlexTable.prototype.possibleTables = function() {
      var space = this.availableSpace();
      var total = 0;
      var column = 0;
      var numTables = 0;
      var tables = [];

      while(true) {
        total = this.columns[0];
        tables[numTables] = {
          $el: null,
          columns: []
        };

        do {
          total += this.columns[++column];
          tables[numTables].columns.push(column - 1);
        } while((total + this.columns[column + 1]) < space);

        numTables++;

        if(column === this.columns.length - 1) {
          break;
        }
      }

      return tables;
    };

    FlexTable.prototype.sameTablesAsBefore = function(tables) {
      if(this.tables.length !== tables.length) {
        return false;
      }

      for(var i = 0, len = tables.length; i < len; i++) {
        if(tables[i].columns.length !== this.tables[i].columns.length) {
          return false;
        }
      }

      return true;
    };

    FlexTable.prototype.clearExistingTables = function() {
      this.tables.forEach(function(table) {
        table.$el.remove();    
      });  
    };

    FlexTable.prototype.tableTemplate = function() {
      var $table = $("<table></table>");
      var $tbody = $("<tbody></tbody>");
      $table.append("<thead><tr><th></th></tr></thead>");
      this.data.forEach(function(element, index) {
        this.cellTemplate(true)
          .text(this.rowLabels[index])
          .appendTo($("<tr></tr>").appendTo($tbody));
      }.bind(this));
      return $table.append($tbody);
    };

    FlexTable.prototype.cellTemplate = function(th) {
      return $(th ? "<th></th>" : "<td></td>");
    };

    FlexTable.prototype.buildTable = function(table, column) {
      var $table = this.tableTemplate();
      for(var i = 0, len = table.columns.length; i < len; i++, column++) {
        this.cellTemplate(true)
          .text(this.columnLabels[column])
          .appendTo($table.find("thead tr"));
        for(var j = 0, lenj = this.data.length; j < lenj; j++) {
          this.cellTemplate()
            .text(this.data[j][table.columns[i]])
            .appendTo($table.find("tbody tr").eq(j));
        }
      }

      return $table;
    };

    FlexTable.prototype.restructure = function() {
      var tables = this.possibleTables();

      if(this.sameTablesAsBefore(tables)) {
        return;
      }

      this.clearExistingTables();

      for(var i = 0, column = 0, len = tables.length; i < len; column += tables[i++].columns.length) {
        var $table = this.buildTable(tables[i], column);
        tables[i].$el = $table;
        $(".tables").append($table);
      }

      this.tables = tables;
    };

    $(function() {
      FlexTable(".tables table:first", window);
    });

    * {
      margin: 0;
      padding: 0;
    }

    body {
      padding: 10px 20px;
    }

    table {
      border-collapse: collapse;
    }

    table + table {
      margin-top: 15px;
    }


    table th,
    table td {
      white-space: nowrap;
      border: 1px solid #ccc;
      padding: 5px 10px;
      text-align: left;
    }

    table tr th:first-of-type {
      border: 0;
    }

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
HTML:

    <div class="tables">
      <table>
        <thead>
          <tr>
            <th></th>
            <th>Name</th>
            <th>Position</th>
            <th>Office</th>
            <th>Age</th>
            <th>Start date</th>
            <th>Salary</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <th></th>
            <td>Tiger Nixon</td>
            <td>System Architect</td>
            <td>Edinburgh</td>
            <td>61</td>
            <td>2011/04/25</td>
            <td>$320,800</td>
          </tr>
          <tr>
            <th></th>
            <td>Garrett Winters</td>
            <td>Accountant</td>
            <td>Tokyo</td>
            <td>63</td>
            <td>2011/07/25</td>
            <td>$170,750</td>
          </tr>
          <tr>
            <th></th>
            <td>Ashton Cox</td>
            <td>Junior Technical Author</td>
            <td>San Francisco</td>
            <td>66</td>
            <td>2009/01/12</td>
            <td>$86,000</td>
          </tr>
          <tr>
            <th></th>
            <td>Cedric Kelly</td>
            <td>Senior Javascript Developer</td>
            <td>Edinburgh</td>
            <td>22</td>
            <td>2012/03/29</td>
            <td>$433,060</td>
          </tr>
          <tr>
            <th></th>
            <td>Airi Satou</td>
            <td>Accountant</td>
            <td>Tokyo</td>
            <td>33</td>
            <td>2008/11/28</td>
            <td>$162,700</td>
          </tr>
          <tr>
            <th></th>
            <td>Brielle Williamson</td>
            <td>Integration Specialist</td>
            <td>New York</td>
            <td>61</td>
            <td>2012/12/02</td>
            <td>$372,000</td>
          </tr>
          <tr>
            <th></th>
            <td>Herrod Chandler</td>
            <td>Sales Assistant</td>
            <td>San Francisco</td>
            <td>59</td>
            <td>2012/08/06</td>
            <td>$137,500</td>
          </tr>
          <tr>
            <th></th>
            <td>Rhona Davidson</td>
            <td>Integration Specialist</td>
            <td>Tokyo</td>
            <td>55</td>
            <td>2010/10/14</td>
            <td>$327,900</td>
          </tr>
          <tr>
            <th></th>
            <td>Colleen Hurst</td>
            <td>Javascript Developer</td>
            <td>San Francisco</td>
            <td>39</td>
            <td>2009/09/15</td>
            <td>$205,500</td>
          </tr>
          <tr>
            <th></th>
            <td>Sonya Frost</td>
            <td>Software Engineer</td>
            <td>Edinburgh</td>
            <td>23</td>
            <td>2008/12/13</td>
            <td>$103,600</td>
          </tr>
          <tr>
            <th></th>
            <td>Jena Gaines</td>
            <td>Office Manager</td>
            <td>London</td>
            <td>30</td>
            <td>2008/12/19</td>
            <td>$90,560</td>
          </tr>
          <tr>
            <th></th>
            <td>Quinn Flynn</td>
            <td>Support Lead</td>
            <td>Edinburgh</td>
            <td>22</td>
            <td>2013/03/03</td>
            <td>$342,000</td>
          </tr>
          <tr>
            <th></th>
            <td>Charde Marshall</td>
            <td>Regional Director</td>
            <td>San Francisco</td>
            <td>36</td>
            <td>2008/10/16</td>
            <td>$470,600</td>
          </tr>
          <tr>
            <th></th>
            <td>Haley Kennedy</td>
            <td>Senior Marketing Designer</td>
            <td>London</td>
            <td>43</td>
            <td>2012/12/18</td>
            <td>$313,500</td>
          </tr>
          <tr>
            <th></th>
            <td>Tatyana Fitzpatrick</td>
            <td>Regional Director</td>
            <td>London</td>
            <td>19</td>
            <td>2010/03/17</td>
            <td>$385,750</td>
          </tr>
          <tr>
            <th></th>
            <td>Michael Silva</td>
            <td>Marketing Designer</td>
            <td>London</td>
            <td>66</td>
            <td>2012/11/27</td>
            <td>$198,500</td>
          </tr>
          <tr>
            <th></th>
            <td>Paul Byrd</td>
            <td>Chief Financial Officer (CFO)</td>
            <td>New York</td>
            <td>64</td>
            <td>2010/06/09</td>
            <td>$725,000</td>
          </tr>
          <tr>
            <th></th>
            <td>Gloria Little</td>
            <td>Systems Administrator</td>
            <td>New York</td>
            <td>59</td>
            <td>2009/04/10</td>
            <td>$237,500</td>
          </tr>
          <tr>
            <th></th>
            <td>Bradley Greer</td>
            <td>Software Engineer</td>
            <td>London</td>
            <td>41</td>
            <td>2012/10/13</td>
            <td>$132,000</td>
          </tr>
          <tr>
            <th></th>
            <td>Dai Rios</td>
            <td>Personnel Lead</td>
            <td>Edinburgh</td>
            <td>35</td>
            <td>2012/09/26</td>
            <td>$217,500</td>
          </tr>
          <tr>
            <th></th>
            <td>Jenette Caldwell</td>
            <td>Development Lead</td>
            <td>New York</td>
            <td>30</td>
            <td>2011/09/03</td>
            <td>$345,000</td>
          </tr>
          <tr>
            <th></th>
            <td>Yuri Berry</td>
            <td>Chief Marketing Officer (CMO)</td>
            <td>New York</td>
            <td>40</td>
            <td>2009/06/25</td>
            <td>$675,000</td>
          </tr>
          <tr>
            <th></th>
            <td>Caesar Vance</td>
            <td>Pre-Sales Support</td>
            <td>New York</td>
            <td>21</td>
            <td>2011/12/12</td>
            <td>$106,450</td>
          </tr>
          <tr>
            <th></th>
            <td>Doris Wilder</td>
            <td>Sales Assistant</td>
            <td>Sidney</td>
            <td>23</td>
            <td>2010/09/20</td>
            <td>$85,600</td>
          </tr>
          <tr>
            <th></th>
            <td>Angelica Ramos</td>
            <td>Chief Executive Officer (CEO)</td>
            <td>London</td>
            <td>47</td>
            <td>2009/10/09</td>
            <td>$1,200,000</td>
          </tr>
          <tr>
            <th></th>
            <td>Gavin Joyce</td>
            <td>Developer</td>
            <td>Edinburgh</td>
            <td>42</td>
            <td>2010/12/22</td>
            <td>$92,575</td>
          </tr>
          <tr>
            <th></th>
            <td>Jennifer Chang</td>
            <td>Regional Director</td>
            <td>Singapore</td>
            <td>28</td>
            <td>2010/11/14</td>
            <td>$357,650</td>
          </tr>
          <tr>
            <th></th>
            <td>Brenden Wagner</td>
            <td>Software Engineer</td>
            <td>San Francisco</td>
            <td>28</td>
            <td>2011/06/07</td>
            <td>$206,850</td>
          </tr>
          <tr>
            <th></th>
            <td>Fiona Green</td>
            <td>Chief Operating Officer (COO)</td>
            <td>San Francisco</td>
            <td>48</td>
            <td>2010/03/11</td>
            <td>$850,000</td>
          </tr>
          <tr>
            <th></th>
            <td>Shou Itou</td>
            <td>Regional Marketing</td>
            <td>Tokyo</td>
            <td>20</td>
            <td>2011/08/14</td>
            <td>$163,000</td>
          </tr>
          <tr>
            <th></th>
            <td>Michelle House</td>
            <td>Integration Specialist</td>
            <td>Sidney</td>
            <td>37</td>
            <td>2011/06/02</td>
            <td>$95,400</td>
          </tr>
          <tr>
            <th></th>
            <td>Suki Burks</td>
            <td>Developer</td>
            <td>London</td>
            <td>53</td>
            <td>2009/10/22</td>
            <td>$114,500</td>
          </tr>
          <tr>
            <th></th>
            <td>Prescott Bartlett</td>
            <td>Technical Author</td>
            <td>London</td>
            <td>27</td>
            <td>2011/05/07</td>
            <td>$145,000</td>
          </tr>
          <tr>
            <th></th>
            <td>Gavin Cortez</td>
            <td>Team Leader</td>
            <td>San Francisco</td>
            <td>22</td>
            <td>2008/10/26</td>
            <td>$235,500</td>
          </tr>
          <tr>
            <th></th>
            <td>Martena Mccray</td>
            <td>Post-Sales support</td>
            <td>Edinburgh</td>
            <td>46</td>
            <td>2011/03/09</td>
            <td>$324,050</td>
          </tr>
          <tr>
            <th></th>
            <td>Unity Butler</td>
            <td>Marketing Designer</td>
            <td>San Francisco</td>
            <td>47</td>
            <td>2009/12/09</td>
            <td>$85,675</td>
          </tr>
          <tr>
            <th></th>
            <td>Howard Hatfield</td>
            <td>Office Manager</td>
            <td>San Francisco</td>
            <td>51</td>
            <td>2008/12/16</td>
            <td>$164,500</td>
          </tr>
          <tr>
            <th></th>
            <td>Hope Fuentes</td>
            <td>Secretary</td>
            <td>San Francisco</td>
            <td>41</td>
            <td>2010/02/12</td>
            <td>$109,850</td>
          </tr>
          <tr>
            <th></th>
            <td>Vivian Harrell</td>
            <td>Financial Controller</td>
            <td>San Francisco</td>
            <td>62</td>
            <td>2009/02/14</td>
            <td>$452,500</td>
          </tr>
          <tr>
            <th></th>
            <td>Timothy Mooney</td>
            <td>Office Manager</td>
            <td>London</td>
            <td>37</td>
            <td>2008/12/11</td>
            <td>$136,200</td>
          </tr>
          <tr>
            <th></th>
            <td>Jackson Bradshaw</td>
            <td>Director</td>
            <td>New York</td>
            <td>65</td>
            <td>2008/09/26</td>
            <td>$645,750</td>
          </tr>
          <tr>
            <th></th>
            <td>Olivia Liang</td>
            <td>Support Engineer</td>
            <td>Singapore</td>
            <td>64</td>
            <td>2011/02/03</td>
            <td>$234,500</td>
          </tr>
          <tr>
            <th></th>
            <td>Bruno Nash</td>
            <td>Software Engineer</td>
            <td>London</td>
            <td>38</td>
            <td>2011/05/03</td>
            <td>$163,500</td>
          </tr>
          <tr>
            <th></th>
            <td>Sakura Yamamoto</td>
            <td>Support Engineer</td>
            <td>Tokyo</td>
            <td>37</td>
            <td>2009/08/19</td>
            <td>$139,575</td>
          </tr>
          <tr>
            <th></th>
            <td>Thor Walton</td>
            <td>Developer</td>
            <td>New York</td>
            <td>61</td>
            <td>2013/08/11</td>
            <td>$98,540</td>
          </tr>
          <tr>
            <th></th>
            <td>Finn Camacho</td>
            <td>Support Engineer</td>
            <td>San Francisco</td>
            <td>47</td>
            <td>2009/07/07</td>
            <td>$87,500</td>
          </tr>
          <tr>
            <th></th>
            <td>Serge Baldwin</td>
            <td>Data Coordinator</td>
            <td>Singapore</td>
            <td>64</td>
            <td>2012/04/09</td>
            <td>$138,575</td>
          </tr>
          <tr>
            <th></th>
            <td>Zenaida Frank</td>
            <td>Software Engineer</td>
            <td>New York</td>
            <td>63</td>
            <td>2010/01/04</td>
            <td>$125,250</td>
          </tr>
          <tr>
            <th></th>
            <td>Zorita Serrano</td>
            <td>Software Engineer</td>
            <td>San Francisco</td>
            <td>56</td>
            <td>2012/06/01</td>
            <td>$115,000</td>
          </tr>
          <tr>
            <th></th>
            <td>Jennifer Acosta</td>
            <td>Junior Javascript Developer</td>
            <td>Edinburgh</td>
            <td>43</td>
            <td>2013/02/01</td>
            <td>$75,650</td>
          </tr>
          <tr>
            <th></th>
            <td>Cara Stevens</td>
            <td>Sales Assistant</td>
            <td>New York</td>
            <td>46</td>
            <td>2011/12/06</td>
            <td>$145,600</td>
          </tr>
          <tr>
            <th></th>
            <td>Hermione Butler</td>
            <td>Regional Director</td>
            <td>London</td>
            <td>47</td>
            <td>2011/03/21</td>
            <td>$356,250</td>
          </tr>
          <tr>
            <th></th>
            <td>Lael Greer</td>
            <td>Systems Administrator</td>
            <td>London</td>
            <td>21</td>
            <td>2009/02/27</td>
            <td>$103,500</td>
          </tr>
          <tr>
            <th></th>
            <td>Jonas Alexander</td>
            <td>Developer</td>
            <td>San Francisco</td>
            <td>30</td>
            <td>2010/07/14</td>
            <td>$86,500</td>
          </tr>
          <tr>
            <th></th>
            <td>Shad Decker</td>
            <td>Regional Director</td>
            <td>Edinburgh</td>
            <td>51</td>
            <td>2008/11/13</td>
            <td>$183,000</td>
          </tr>
          <tr>
            <th></th>
            <td>Michael Bruce</td>
            <td>Javascript Developer</td>
            <td>Singapore</td>
            <td>29</td>
            <td>2011/06/27</td>
            <td>$183,000</td>
          </tr>
          <tr>
            <th></th>
            <td>Donna Snider</td>
            <td>Customer Support</td>
            <td>New York</td>
            <td>27</td>
            <td>2011/01/25</td>
            <td>$112,000</td>
          </tr>
        </tbody>
      </table>
    </div>

关于javascript - 拆分 HTML 表格以适合视口(viewport)宽度，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30967990/

文章推荐： html - angular ng-options 指令最终选择了多个项目

文章推荐： hadoop - 没有要停止的 Namenode 或 Datanode 或 Secondary NameNode

文章推荐： hadoop - 配置单元覆盖目录移动过程作为 distcp？

文章推荐： javascript - 在 Powershell 中获取 JavaScript 结果

java - and 之间的区别
大家好，我看到了来自 java 项目中的 jsp 页面。想问一下这些html标签有什么区别。请多多指教。示例代码如下: 最佳答案使用struts-html标签库，其中只是普
html - HTML 页面中损坏的 HTML
我有一个页面，我正在从电子邮件中读取 HTML。有时，来自电子邮件的文本包含 HTML 和 CSS，它完全改变了我的页面样式。我不希望我的页面样式因此受到影响。我如何严格阅读特定 div(框)内的
html - HTML 中的图像 - HTML 表中行之间的间距
我知道有类似的问题，但我想对我的特定代码进行一些输入。我有一个图像，我将其切成 9 块，并创建了一个 3x3 HTML 表来显示它。但是我的表在行之间有空格，但在列之间没有空格。我没有使用任何 C
html - 为什么我的本地 html 链接会转到父文件夹而不是 .html？
编辑:Waylan 的回答成功了!谢谢! 我正在尝试压缩文档的 .html 文件以发送给客户。目标是获得与浏览实际网站相同的体验。打开 .html 文件时，单击的任何链接都会转到父文件夹，而不是特定
html - 为什么我的本地 html 链接会转到父文件夹而不是 .html？
编辑:Waylan 的回答成功了!谢谢! 我正在尝试压缩文档的 .html 文件以发送给客户。目标是获得与浏览实际网站相同的体验。打开 .html 文件时，单击的任何链接都会转到父文件夹，而不是特定
html - 如何解析和规范化来自不同 HTML 生成器的 HTML？
这是 question 的扩展.我正在尝试解析嵌入在 Blogger 博客的 XML 备份中的 HTML 片段，并用 InDesign 标签重新标记它们。 Blogger 并未对其任何帖子的 HTML
html - html 元素之间的换行符破坏了 html 布局
我知道在 html 中元素之间的换行符被视为空格，但我认为当您尝试使用响应式布局时这非常可怕。例如，这里我们有预期和正确的行为，但要获得它，我必须删除元素之间的 html 中的换行符: https:
html - 将带有 html 标签的文本显示为 html
我正在尝试将文本文件显示为 html。我正在使用 ionic 。我正在发送一个 html 格式的响应，但在一个文本文件中发送到配置文件页面。它在 .ts 页面的变量名中。 @Component({
html - 如何在 html 中显示 html？
假设我有一个 html 文档: test 我想在浏览器中显示该代码。然后我会创建类似的东西: <html>test<html> 为了在中间制作 gubbins，我有一个函数
html - HTML 元素和 HTML 标签有什么区别？
HTML 元素和 HTML 标签有什么区别？渲染有什么区别吗？使用标签或元素时有什么特殊注意事项吗？最佳答案是一个标签，特别是一个开始标签也是一个标签，一个结束标签 This is a para
html - 降低 html 表格高度和过度滚动 - HTML
我有这个表格的模态形式。该表正在填充大量数据，但我不想分页。相反，我想以模式形式降低表格的高度并为表格添加溢出。下面是我的代码，但它不起作用。请问我该如何实现？ CSS #table{
html - 查看 HTML 代码而不是呈现的 HTML
我记得有一个 Linux 命令可以从给定的 URL 返回 HTML 代码。您可以将 URL 作为此命令的参数，然后返回 HTML 代码，而不是在浏览器中输入 URL。哪个命令执行此操作？最佳答案
html - 在 html 中显示 html
我有一个 html 页面，我想在其中包含另一个有很多链接的 html 页面。我能够使用 iframe 实现它，但我希望 iframe 内的页面具有与原始页面相同的文本和链接颜色属性，我不想要滚动条，我
html - 如何从另一个 HTML 加载部分 HTML？
我正在使用 HTML 写一本书。如果我把它写在一个 html 文件中，整个代码就会变长，所以我想将每一章保存到不同的文件中，然后将它们加载到主 html 中。我的意思是有像 chapter1.html
html - 将 html 页面重定向到另一个 html
在显示之前，我必须将一个网站重定向到另一个网站。我试过使用 .htaccess，但它给我带来了问题。我也使用过 javavscript 和 meta，但在加载我要从中传输的页面之前它不起作用。帮助？
html - 将网页 html 转换为电子邮件 html
关闭。这个问题不符合Stack Overflow guidelines .它目前不接受答案。我们不允许提问寻求书籍、工具、软件库等的推荐。您可以编辑问题，以便用事实和引用来回答。关闭 7 年前。
html - 使用 html 打印 ""
如何打印“html”标签，包括“”？如何在不使用文本区域和 Javascript 的情况下对任何标签执行此操作？最佳答案使用HTML character references : <html
html - 如何将 html.slim 文件转换为 html 或 html.erb？
我需要将 Ruby on Rails 应用程序中的 html.slim 文件转换为 html.erb。有什么简单的方法吗？我尝试了 Stack Overflow 和其他网站中列出的许多选项。但对我没有
html - 没有标签可以创建 HTML 文档吗？
这个问题在这里已经有了答案: Is it necessary to write HEAD, BODY and HTML tags? (6 个答案) 关闭 8 年前。我在 gitHub 上找到了这个
html - 什么是加载外部资源的 HTML 元素列表？ (HTML 电子邮件)
如果不允许通过 JavaScript 进行额外的 DOM 操作，我正在寻找可以加载外部资源的元素列表。我正在尝试使用 HTML 查看器托管来自第三方的电子邮件，当发生这种情况时，我需要删除任何自动加载

可可西里

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

javascript - 拆分 HTML 表格以适合视口(viewport)宽度