JavaScriptで列間のルールの幅を設定するにはどうすればよいですか？
例
<!DOCTYPE html>
<html>
<head>
<style>
#myID {
column-count: 4;
column-rule: 4px solid yellow;
}
</style>
</head>
<body>
<p>Click below to change width</p>
<button onclick="display()">Change Width 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.columnRuleWidth = "8px";
}
</script>
</body>
</html> -
CSSを使用して列間のルールの幅を設定します
column-rule-widthを使用します 列間のルールの幅を設定するプロパティ。 例 次のコードを実行して、column-rule-widthプロパティを実装してみてください。 <!DOCTYPE html> <html> <head> <style> .demo { column-count: 4; &nb
-
CSSを使用して列間のルールのスタイルを設定します
列間のルールのスタイルを設定するには、 column-rule-styleを使用します 財産。次のコードを実行して、 column-rule-styleを実装してみてください。 プロパティ。 例 <!DOCTYPE html> <html> <head> <style> .demo { column-count: 4;