html - 如何仅将div标签添加到div中的p标签并在一行中显示p标签文本？

div元素具有背景图像。图像说明中有一个p标记。但是，我不希望整个div元素都是超链接，而只是p标记内的文本。

当前代码：
html

<div id="p1" class="trp"><a href="#"><p>Jacob A.</p></a></div>
<div id="p2" class="trp"><p>In Jo Sung</p></div>
<div id="p3" class="trp"><p>Kim Min Ho</p></div>

的CSS

.trp{
    height: 20px;
    width: 20px;
    margin: 1%;
    border: 1px solid black;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;

}

.trp p
{
    text-align:right;
    margin:0px 0px 0px 25px;
    display: inline-block;
    font-size:8pt;
    font-family:Lucida Sans;
    padding:2px;
}

另外，尽管有足够的空间，但p标签文本显示为两行而不是一行。

最佳答案

p是块级元素。您不能将paragraph包裹在hyperlink内。这是HTML4标准，尽管在HTML5中被忽略。

正确的代码：

<div id="p1" class="trp"><p><a href="#">Jacob A.</a></p></div>
<div id="p2" class="trp"><p>In Jo Sung</p></div>
<div id="p3" class="trp"><p>Kim Min Ho</p></div>

JSfiddle

关于html - 如何仅将div标签添加到div中的p标签并在一行中显示p标签文本？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/30316189/