HTML/CSS文本输入框不显示问题求助

你的text输入框无法显示，完全是因为CSS里针对#book的样式设置，和span、div的属性无关：

#book {position: absolute; opacity: 0; height: 0px;}

这段代码直接把id为book的元素（也就是你的text输入框）设置为：

• 绝对定位（脱离文档流）
• 完全透明（opacity:0）
• 高度为0

这三个属性叠加后，输入框自然就看不到了。

解决步骤 #

1. 直接删除或者注释掉上述#book的样式规则；
2. 如果你需要保留该选择器（比如原本是为其他元素准备的），可以修改属性让输入框正常显示：

#book {position: static; opacity: 1; height: auto;}

补充说明 #

为什么你写的input[type=text]样式没生效？因为CSS选择器优先级中，id选择器（#book）的优先级远高于属性选择器（input[type=text]），所以正常的输入框样式被#book的隐藏样式覆盖了。

内容的提问来源于stack exchange，提问作者John