html - 如何输出没有 "widows"的多列 html？-6ren

html - 如何输出没有 "widows"的多列 html？

转载作者：可可西里更新时间：2023-11-01 13:40:46

25

4

我需要将分类链接列表输出到 HTML，正好是三列文本。它们的显示方式必须类似于报纸或杂志中的专栏。因此，例如，如果总共有 20 行，第一列和第二列将包含 7 行，最后一列将包含 6 行。列表必须是动态的；它会定期更改。

棘手的部分是链接是用标题分类的，而这个标题不能是“寡妇”。如果你有页面布局背景，你就会知道这意味着标题不能显示在列的底部——它们下面必须至少有一个链接，否则它们应该跳到下一列(我知道，技术上如果我真的在做页面布局，它应该是两行，但在这种情况下，一行是可以接受的)。我很难弄清楚如何完成这项工作。

这是我的意思的一个例子:

Shopping     Link 3      Link1Link 1       Link 4      Link2Link 2                   Link 3Link 3       Cars             Link 1      MusicGames        Link 2      Link 1Link 1              Link 2       News

如您所见，“新闻”标题位于中间栏的底部，“寡妇”也是如此。这是无法接受的。我可以将它撞到下一列，但这会在第二列的底部产生不必要的大量空白。相反，整个列表需要重新平衡。

我想知道是否有人有任何关于如何完成此操作的提示，或者源代码或插件。Python 是首选，但任何语言都可以。我只是想把一般概念记下来。

最佳答案

总的要点是构建一个包含所有“可流动”项目(包括类别)的主列表，然后遍历该列表，根据需要调整每列的行数，以便没有类别保持寡落(或您可能有的任何其他条件。 )

Module Module1

    Dim Categories As New Dictionary(Of String, List(Of String))

    Sub Main()

        Const Columns As Integer = 3

        ' create the category items
        Dim ShoppingList As New List(Of String)
        Dim GamesList As New List(Of String)
        Dim CarsList As New List(Of String)
        Dim NewsList As New List(Of String)
        Dim MusicList As New List(Of String)

        ShoppingList.Add("Link1")
        ShoppingList.Add("Link2")
        ShoppingList.Add("Link3")

        GamesList.Add("Link1")
        GamesList.Add("Link2")
        GamesList.Add("Link3")
        GamesList.Add("Link4")

        CarsList.Add("Link1")
        CarsList.Add("Link2")

        NewsList.Add("Link1")
        NewsList.Add("Link2")
        NewsList.Add("Link3")

        MusicList.Add("Link1")

        ' create the categories
        Categories.Add("Shopping", ShoppingList)
        Categories.Add("Games", GamesList)
        Categories.Add("Cars", CarsList)
        Categories.Add("News", NewsList)
        Categories.Add("Music", MusicList)

        ' count each category and its items
        Dim TotalRows As Integer = Categories.Count
        For Each kvp As KeyValuePair(Of String, List(Of String)) In Categories
            TotalRows += kvp.Value.Count
        Next

        ' add a space between each category
        TotalRows += (Categories.Count - 1)

        ' determine the number of rows per column
        Dim RowsPerColumn As Integer = Int(TotalRows / Columns) + If((TotalRows Mod Columns) > 0, 1, 0)

        ' build a master list
        Dim master As New List(Of String)
        For Each kvp As KeyValuePair(Of String, List(Of String)) In Categories
            master.Add(kvp.Key)
            For Each item As String In kvp.Value
                master.Add(item)
            Next
            master.Add("&nbsp;")
        Next

        ' remove the last invalid blank item
        master.RemoveAt(master.Count - 1)

        ' ensure that the RowsPerColumn'th-item in the list is not a category
        Dim adjusted As Boolean
        Do
            adjusted = False
            For i As Integer = 1 To master.Count - 1 Step RowsPerColumn - 1
                If Categories.Keys.Contains(master(i)) Then
                    RowsPerColumn += 1 ' adjust rows per column (could go up or down)
                    adjusted = True
                End If
            Next
        Loop While adjusted

        ' output resulting table
        Using sw As New IO.StreamWriter("test.htm")
            sw.WriteLine("<html>")
            sw.WriteLine("<body>")
            sw.WriteLine("<table cellspacing=""0"" cellpadding=""3"" border=""1"">")
            For j As Integer = 0 To RowsPerColumn - 1
                sw.WriteLine("<tr>")
                Dim columnCount As Integer = 0 ' columns written
                For i As Integer = j To master.Count - 1 Step RowsPerColumn
                    sw.WriteLine("<td>" & master(i) & "</td>")
                    columnCount += 1
                Next
                ' if the number of columns actually written was less than Columns constant
                If columnCount < Columns Then
                    For c As Integer = 0 To Columns - columnCount - 1
                        sw.WriteLine("<td>&nbsp;</td>")
                    Next
                End If
                sw.WriteLine("</tr>")
            Next
            sw.WriteLine("</table>")
            sw.WriteLine("</body>")
            sw.WriteLine("</html>")
        End Using

    End Sub

End Module

关于html - 如何输出没有 "widows"的多列 html？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/2687028/

25

4

0

文章推荐： php - 左侧的正则表达式不贪婪(即，两侧可能的最窄匹配)

文章推荐： windows - 当磁盘上的文件发生更改时 Emacs 挂起

文章推荐： php - 如何通过字符串获取 defined() 值？

python - 检查一个数据框的任何值(多列)是否存在于另一个数据框的任何值(多列)中
我有两个具有不同格式的相似数据的数据框 df1: Nodo X Y Z CTB3901 CTBX3901 CTBY3901 CTBZ3901
sql - WHERE ... IN 多列
这个问题在这里已经有了答案: Using tuples in SQL "IN" clause (9 个回答) 关闭 8 年前。我尝试获得一些满足特定条件的用户: SELECT * FROM use
mysql - 多列 WHERE IN AND
我目前正在使用 MySQL (5.7) 来查询成员表。当我执行如下查询时: SELECT fname, lname, added FROM Members WHERE ((fname, lname)
CSS3 多列
我正在使用 CSS 创建多个列，以提供与 Pinterest 界面类似的外观(例如，框列，但整齐地堆叠在彼此之下)。这是我使用的代码: #feed-post-home .feed { -mo
vba - VLookup 多列
我正在使用 VLookup 函数来查找列中存在的多个值。这工作得很好，但只需要很多时间，因为我在 Excel 表中有 100,000 行。有什么办法可以加快这段代码的速度吗？该代码基本上在列中查找
Excel – 多列，不同的组合
如果这个词正确的话，我有 4 列和 4 个不同的参数。每个参数大约有 3-5 个变量。我想做的是在维护不同列的同时创建 4 个不同参数的所有可能组合。因此，假设我有以下示例: **Column A |
r - 按降序排列_() 多列
我正在尝试使用 arrange_()使用字符串输入并按降序排列在其中一列中。 library(dplyr) # R version 3.3.0 (2016-05-03) , dplyr_0.4.3 #
WPF ComboBox 多列
我只是想知道是否有可以包含多列的 wpf 组合框控件？如果没有，我需要使用什么 XAML 来实现这一目标？如果可能的话，我只是在寻找一个基本的两列组合框，谢谢最佳答案请引用这些链接多列组合
SQL 更新 - 多列
我想使用 Select 根据第二个表中的值更新表中的多个列语句来获取这样的值: UPDATE tbl1 SET (col1, col2, col3) = (SELECT colA, colB, col
IN 子句中的 SQL 多列
如果我们需要根据给定列的某些值集查询表，我们可以简单地使用 IN 子句。但是如果需要基于多列执行查询，我们不能使用 IN 子句(在 SO 线程中 grepped)。从其他 SO 线程，我们可以使用
sql - String_Split 多列
我需要用分隔值拆分表中两列的值。我的源表如下所示: 产品IDean_upc已批准21029618710103368021;8710103368038;87101033680141;0;1929236
c# - 多列 TreeView
我正在尝试在 WPF 中创建一个包含多列的 TreeView 。我很清楚，关于这个主题确实有很多问题。但是，他们在绑定(bind)数据时似乎采用了不同的方法。每个人似乎都设置了 itemssource
Excel 数据透视表 - 多列
我正在尝试使用以下数据在 Excel 中创建数据透视表: 我试图得出的最终结果(使用枢轴)是这样的摘要: 但是我不知道如何让 Excel 计算/添加/考虑所有列。我可以为每个单独的字段/列创建一个数据
c# - 多列 TreeView
我正在尝试在 WPF 中创建一个包含多列的 TreeView 。我很清楚，关于这个主题确实有很多问题。但是，他们在绑定(bind)数据时似乎采用了不同的方法。每个人似乎都设置了 itemssource
SQL MAX 多列？
如何在最多几列的每行返回 1 个值: 表名 [Number, Date1, Date2, Date3, Cost] 我需要返回这样的东西: [Number, Most_Recent_Date, Cos
python - 多列+条件连接
我有两个数据框想要连接在一起(自行车骑行数据框和自行车站数据框)。我一直在使用 pandas 库，但我似乎无法编写代码来完美地操作连接。最初，我只是加入关键“station_id”，但我发现最近更新
python - csvjoin 多列
我有以下 csv 文件，我想要内部联接 CSV 1:Trip_Data.csv (250MB) head -2 rand_trip_data_1.csv medallion,hack_license,
python - merge_asof 多列
我知道以前也有人问过类似的问题。但是，我的问题略有不同。我正在尝试跨多个列获取 merge_asof 的功能。这是数据集: import pandas as pd left = pd.DataFram
MySQL 多列、单查询
我有一个数据库，里面保存着客户的数据。我需要知道我们在各个城市和国家有多少客户。我必须用单个查询来完成它。我的表是客户，我有城市和国家列(均为varchar)，其中包含有关它的信息。所需的查询输出
php - 左连接两个表，多列
我需要左连接两个表:Cardealers 和Applications。我想查看哪些信用卡经销商收到了哪些申请。每个申请都会转发给三个发卡商，因此我的表结构具有以下 3 列:receiver_1、r

首页

博学

6Ren·AI

商城

html - 如何输出没有 "widows"的多列 html？