Question

我使用html，css和一些脚本创建了简单的网页。

这是我试过的jsfiddle：http://jsfiddle.net/67x8cyp9/

<p>
 <img class="text-wrap" align="right" src="img/9780143332497.jpg">
 <div class="caption">
    <form method="get" action="9780143332497.png">
       <button type="submit">Download!</button>
    </form>
 </div>
</p>

在<form>代码中使用<div>代码和<p>代码是否正确？

另外，如何在图像下设置下载按钮？

任何人都可以帮我解决这个问题吗？

提前致谢。

Answer 1

不推荐。

根据W3规范，<p>仅允许包含文本或“内联”（非“块”）标记。但是，<form>计为“阻止”内容而不是“内联”内容（请参阅<p>标记中最小内容模型的this。或者，您可以使用<div>附上<form>

您可以在w3 validator上验证您的html代码，以便更清晰。

干杯！

Answer 2

不是不是，p是一个块元素，但不能包含其他块元素，只能包含内联元素。（至少在HTML4中，但我不认为HTML5会改变这种行为）。

嗯，根据MDN，您可以在form中添加p，但实际上会发生的是p的结尾位于div的开头。形式，所以不是很有用。

<强>更新

为了帮助您解决当前的实际问题，您可以将内容换成p而不是<div class="right-figure"> <img class="text-wrap" src="img/9780143332497.jpg"> <div class="caption"> <form method="get" action="9780143332497.png"> <button type="submit">Download!</button> </form> </div> </div>：

.right-figure {
     float: right;
}

在CSS文件中：

<a href="9780143332497.png" target="_blank">Download!</a>

这样做，你需要的。

另一种方法：

顺便说一句，您也可以使用链接而不是表单：

{{1}}

并使用CSS格式化锚点看起来像一个按钮，就像例如Twitter Bootstrap确实。

是否可以在html中使用p标签内的form和div标签？

2 个答案: