Question

我正在开发一个使用ESP8266 WIFI模块的物联网项目。对于那些不熟悉的人来说，足以说它是具有wifi功能的SOC，可用于站或AP模式。有几种方法可以将程序上传到这个小小的奇迹，我使用的是带有Lua的NodeMCU平台。

现在问题的关键在于尝试通过Lua解释器上传一个HTML字符串，以显示为IoT控件的网页。我有这个工作，但不得不做一些重建系统，以添加更多的控制点。除了上传的问题（Lua解释器的问题），它不需要注意，我遇到了在访问时发送到浏览器的String的问题。

我基本上有两个按钮，并希望使用＆amp; nbsp进行分离。这最初工作，但现在它在我尝试的所有浏览器中产生蓝色短划线。要发送的字符串如下：

<p style= "font-size:90px;">
  Rear Left &nbsp;<a href=\"?pin=ON1\"><button style= \"width:150px;height:150px;font-size:90px;background:green;\">On</button></a>&nbsp;<a href=\"?pin=OFF1\"><button style= \"width:150px;height:150px;font-size:90px;background-color:red;">Off</button></a>
</p>"

奇怪的是，当包含HTML代码字符串的程序片段保存到文件并使用浏览器打开时，它看起来很好吗？！有什么见解吗？

Answer 1

奇怪的是，包含HTML代码字符串的程序片段是保存到文件并使用浏览器打开它看起来不错？！

不，一旦你清理了所有语法问题，它就不再适合了：

你的问题与NodeMCU，ESPlorer et.al无关。根据{{3}}：

，您的代码根本不是有效的HTML5

内容模型： HTML5 Spec Document from W3C，但必须没有Transparent后代。

只要内部没有交互式内容（例如按钮或其他链接），a元素可以包裹整个段落，列表，表格等，甚至整个部分。

您无法在<button>中嵌套<a>。而是将该按钮包含在<form>标记内：

<p style="font-size:90px; display: inline">
  Rear Left
  <form href="?pin=ON1" style="display: inline" method="get">
    <button style="width:150px;height:150px;font-size:90px;background:green;">On</button>
  </form>
  &nbsp;
  <form href="?pin=OFF1" style="display: inline" method="get">
    <button style="width:150px;height:150px;font-size:90px;background-color:red;">Off</button>
  </form>
</p>

但是，你应该IMO真正做的是使用简单的HTML锚点

<p style="font-size:90px;">
  Rear Left
  <a href="?pin=ON1">On</a>
  <a href="?pin=OFF1">Off</a>
</p>

并设置这两个链接的样式，例如按钮（例如interactive content或https://designshack.net/?p=25423）。

为什么会产生蓝色破折号

1 个答案: