是否可以在多個div上顯示一個字符串？

-1

我有一個字符串，它是x（讓我們說10,000爲參數）char long。然後我可以在<div>中顯示該字符串。到目前爲止，我可以在一個div中顯示整個字符串，這很好。是否可以在多個div上顯示一個字符串？

所以，假設我有以下幾點：

字符串 - 「此字符串是10000個字符長」

的div - [DIV1] [DIV2] [DIV3]

我想分割字符串並根據<div>的寬度/高度將其顯示在多個<div>元素上。

結果 - [此字符串] [10000] [長字符]

到目前爲止，我可以打破使用maxCharPerDiv變量

我JS串入子和顯示部分字符串

var contents; //this is my endless string 
    var content; 
    var maxCharPerDiv = 1000; 
    var currentDiv = ""; 
    var divsArray = []; 

    function contentBreak(str, len) { 
    if (str.length < len) { 
     return divsArray.push(str); 
    } else { 
     divsArray.push(str.substring(0, len)); 
    } 
    contentBreak(str.substring(len), len); 
    } 

    for (var i = 0; i < contents.length; i++) { 
    content = contents[i].content; 
    contentBreak(content, maxCharPerDiv); 
    } 

    for (var k = 0; k < divsArray.length; k++) { 
    console.log(divsArray[k] + "\n"); 
    }

CSS

div { 
    width: 380px; 
    height: 582px; 
    background: white; 
    color: #ccc; 
}

上述工作並返回終端中的子字符串，但我只有1出現在我的div上，因爲其餘溢出超出設定的高度/寬度。

問題：

是否有可能實現這樣的顯示
是否有可能基於一個div的寬度/高度這樣做呢？

非常感謝在正確的方向微調。

謝謝。

來源

2017-02-27 Ange

_絕對沒有，除非你有等寬字體（即使在這種情況下，換行也會破壞邏輯）。 – hindmost

我不知道你爲什麼要這樣做，但如果只是爲了顯示目的，你可能想看看CSS多列布局：https：//developer.mozilla.org/en-US/docs/Web/CSS/CSS_Columns/Using_multi-column_layouts – helb

@ behindmost oh ...我明白了。在這裏，我希望這是大聲笑！感謝您告訴我，我必須找到一種方法將字符串分解爲單獨的元素，並將它們備份到各自的div中，也許？或者嘗試@helb建議的CSS多列布局。它僅用於顯示目的。我有2個獨立的div（可能使用更多），只有一個字符串。感謝您的建議，我會爲此提供一個理由。 – Ange

創建一個div類，然後添加CSS代碼來改變div的z-index的

例如

你的CSS：_Is可以這樣做基於對一個div的寬度/高度

#always-on-top {z-index: 9999999;}

應該做的伎倆;-)

來源

2017-02-27 15:56:46 FusionDesign

感謝您的回覆。雖然這樣做只設置我的div的堆棧順序，如[w3schools]（https://www.w3schools.com/cssref/playit.asp?filename=playcss_z-index&preval=2）中所述。這不允許我的字符串顯示在多個div :( – Ange

是否可以在多個div上顯示一個字符串？

回答

相關問題