用HTML创建类似Microsoft Office Word的表生成器的控件

Question

是否可以使用HTML5或Javascript创建这样的控件？我发现以下link在其中仅使用CSS即可创建类似于图形的图形。

$trans: transparent;
$block: #00004f;
$line: #19465b;
$gridSize: 60px;
$subdivisions: 1;
$lineAlpha: .1;
$sublineAlpha: 1;
$gridHeight : 120px;

body {
  background-color: $block;
  background-image:
    linear-gradient(rgba($line,$sublineAlpha) 1px, $trans 1px), /*sub horiz*/
    linear-gradient($line 1px, $trans 1px), /*main horiz*/
    linear-gradient(90deg, rgba($line,$sublineAlpha) 1px, $trans 1px), /*sub vert*/
    linear-gradient(90deg, rgba($line,$lineAlpha) 1px, $trans 1px), /*main vert*/
    linear-gradient($trans 3px, $block 3px, $block $gridSize - 2, $trans $gridSize - 2), /*nub horiz*/
    linear-gradient(90deg, rgba($line,$lineAlpha) 3px, $trans 3px, $trans $gridHeight - 2, rgba($line,$lineAlpha) $gridSize - 2) /*nub vert*/
    ;
  background-size:    
    $gridHeight / $subdivisions $gridSize / $subdivisions;        
}

我对Javascript开发非常陌生。是否有任何可用的第三方库对我有用？

Answer 1

答案是“是”，实际上是“是，这应该是javascript”。也就是说，并不是全部-使用css进行视觉样式（颜色等）。您会从此过程中学到很多东西，所以我同意。您的HTML将“告诉”浏览器要显示的元素（您的表格），您的JS将用于“发生的事情”（悬停，单击，有关表格的信息），而CSS则用于样式。我以这个页面为例-https://html-cleaner.com/html-table-generator/