我从来没有写过网页，也不知道zippola的超文本标记语言代码，但我正在阅读一些新手指南，并开始学习. 我的问题是，我如何制作一个简单的垂直矩形，比如10个正方形堆叠在一起.然后，根据输入的不同，这些方块将根据特定的输入从白色变为绿色(该输入将来自微控制器，这是我整个项目的另一部分).
我只需要知道什么是html代码来做一些事情，像我附加的图片.微控制器我将使用10个GPIO作为简单的True/False输入，所以当1个GPIO=True时，我希望相应的方块变成绿色.
我还没有try 过任何东西，因为我真的不知道从哪里开始.不寻找任何花哨的东西，只需要一个空白的网页，上面有垂直堆叠的正方形(这样它们看起来都是相连的)
这就是关于HTML的问题的答案.它包含用于方块大小和 colored颜色 的嵌入式CSS，但使用单独的CSS规则(与div中的内联样式相反)以使样式更易于更改.这个答案不涉及GPIO如何连接到计算机或值如何到达软件--根据这一点，您可能需要生成HTML的代码，或者从GPIO读取信号的HTML中的Java脚本代码，或者另一种解决方案.
<html>
<head>
<style type="text/css">
.square0, .square1 {
border: 1px solid black;
width: 50px;
height: 50px;
}
.square0 {
background-color: white;
}
.square1 {
background-color: green;
}
</style>
</head>
<body>
<div class="square0"></div>
<div class="square0"></div>
<div class="square1"></div>
<div class="square0"></div>
<div class="square1"></div>
<div class="square1"></div>
<div class="square0"></div>
<div class="square1"></div>
<div class="square1"></div>
<div class="square1"></div>
</body>
</html>