在html页面上的<div>块中随机显示超过x行的x

问题描述

我有两个 DIV 块,每个 DIV 块的文本总是超过 5 行。


<!DOCTYPE html>
<html>
<head>
<Meta charset="UTF-8">
<Meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">

<style>

body {
   background: #2196f3;
   color: #ffffff;
}

.div1 {
 background-color: #2196f3;
}

.div2 {
 background-color: #2196f3;
}

</style>
</head>

<body>

<div class="w3-container w3-center w3-padding">
<b>DIV1</b>
<div class="div1">
<p>Div Text1.1</p>
<p>Div Text1.2</p>
<p>Div Text1.3</p>
<p>Div Text1.4</p>
<p>Div Text1.5</p>
<p>Div Text1.6</p>
<p>Div Text1.7</p>
<p>Div Text1.8</p>
<p>Div Text1.9</p>
</div>

<div class="w3-container w3-center w3-padding">
<b>DIV2</b>
<div class="div2">
<p>Div Text2.1</p>
<p>Div Text2.2</p>
<p>Div Text2.3</p>
<p>Div Text2.4</p>
<p>Div Text2.5</p>
<p>Div Text2.6</p>
<p>Div Text2.7</p>
<p>Div Text2.8</p>
<p>Div Text2.9</p>
</div>


</body>
</html>

如何在每次重新加载浏览器时打乱两个 DIV bLock 中的行,屏幕上会显示 5 行与 x 行不同的行?

刷新/重新加载浏览器


<div class="w3-container w3-center w3-padding">
<b>DIV1</b>
<div class="div1">
<p>Div Text1.1</p>
<p>Div Text1.2</p>
<p>Div Text1.4</p>
<p>Div Text1.6</p>
<p>Div Text1.7</p>
</div>

<div class="w3-container w3-center w3-padding">
<b>DIV2</b>
<div class="div2">
<p>Div Text2.3</p>
<p>Div Text2.4</p>
<p>Div Text2.6</p>
<p>Div Text2.7</p>
<p>Div Text2.9</p>
</div>

...等等。

有这方面的脚本吗?

附言我不是编码员。我对此一无所知。如果有人能为我提供可行的解决方案,那将非常有帮助。

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)

相关问答

Selenium Web驱动程序和Java。元素在(x,y)点处不可单击。其...
Python-如何使用点“。” 访问字典成员?
Java 字符串是不可变的。到底是什么意思?
Java中的“ final”关键字如何工作?(我仍然可以修改对象。...
“loop:”在Java代码中。这是什么,为什么要编译?
java.lang.ClassNotFoundException:sun.jdbc.odbc.JdbcOdbc...