ใช้ columnRuleStyle คุณสมบัติเพื่อกำหนดรูปแบบของกฎ คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อกำหนดรูปแบบของกฎระหว่างคอลัมน์ด้วย JavaScript -
ตัวอย่าง
<!DOCTYPE html>
<html>
<head>
<style>
#myID {
column-count: 4;
column-rule: 4px dotted yellow;
}
</style>
</head>
<body>
<p>Click below to change style</p>
<button onclick="display()">Change Style between Columns</button>
<div id="myID">
This is demo text. This is demo text. This is demo text. This is demo text.
This is demo text. This is demo text. This is demo text. This is demo text.
This is demo text. This is demo text. This is demo text. This is demo text.
This is demo text. This is demo text. This is demo text. This is demo text.
This is demo text. This is demo text. This is demo text. This is demo text.
This is demo text. This is demo text. This is demo text. This is demo text.
This is demo text. This is demo text. This is demo text. This is demo text.
</div>
<script>
function display() {
document.getElementById("myID").style.columnRuleStyle = "inset";
}
</script>
</body>
</html> 