如果我使用Javascript和CSS动态获取数据库的文本，如何将文本划分为列

How to divide text into columns, if I get text dynamically for database using Javascript and CSS?

本文关键字：文本 划分 数据库 Javascript 获取 动态 CSS 如果      更新时间：2023-09-26

我认为一个脚本使每个容器中一定数量的字符可以工作。你知道这样的剧本吗?这是一个响应式设计，我可以使用几个css文件，但我只需要一个html文件:

问题是在文本中，我将动态获取，所以我不知道我将获得多少字符。在桌面大小中，段落是一个一个地排列在其他段落之上。在Ipad尺寸下，段落被排列成两列，一些在右边，一些在左边。

您可以使用CSS3的columns单独使用CSS来完成该任务，尽管它在IE8及以下版本中不支持;

div {
    -moz-column-count: 3;
    -moz-column-gap: 10px;
    -webkit-column-count: 3;
    -webkit-column-gap: 10px;
    column-count: 3;
    column-gap: 10px;
    width: 560px;
}

作为IE的退路，你可以使用条件注释和其他海报建议的jQuery砌筑或Columnizer。

在IE中优雅地降级的演示

有一些jquery插件。例如:Columnizer

你是这么想的吗?

var yourText = $('selector');
$(yourText).each(function() {
    if ($(this).text().length >= 200) {
        $(this).text($(this).text().substring(0, 200)0);
    }
});

它将获得前200个字母。对于下一个200，你需要将变量0,200切换到200,400，不幸的是，它将拆分一个单词，并且不识别某些字母比其他字母更宽…

相关文章：