用段落标记替换输入文本

Question

我使用输入文本和框使用CSS进行基本的颜色显示，我只使用输入文本实现它，你可以看到这个fiddle，我想用相同的调整但不使用输入文本，我需要做的只是显示为<p>标记

我尝试使用段落标记替换输入，但它像fiddle

一样令人失望

非常感谢帮助。此致

Answer 1

您已将填充添加到输入标记中，当您将其转换为段落时，这些标记错过了。 所以只需将它们添加到您的段落标签中，

.input-color p {
  padding-left: 25px;
}

参见 JSFiddle

如果您仍然希望它们具有像外观一样的文本框，您只需添加背景颜色，边框和足够的宽度，填充和边距。

参见 JSFiddle

Answer 2

假设您要保留这些框，可以将这个小片段添加到您的CSS中

p.input{
  width: 150px;
  height:16px;
  border: solid 1px #000;
}

您必须让该段落具有类＆＃34;输入＆＃34;并且在你的文本正确显示之前（当然其他人有一些可行的东西）。如果你想要相同的颜色，使用十六进制：＃111111，如果不是确切的颜色，它应该是相同的。只是为了看到这一点，这是我的 JSFiddle