这是我的代码,我只是从教程中复制了此代码,然后修改了代码以供使用,但并未显示出我想要的内容,它无法正常工作。 这是我的CSS:
.project-item h3{
cursor: pointer;
}
#project-contentOne{
display: none;
}
.project-item :hover #project-contentOne{
display: block;
}
<div class="project-item">
<h3>University-wide High Spped Information Network</h3>
<div id="project-contentOne" class="p-content">
<p>University wide High-Speed Information Network is a
component of the 5-year project plan which is the eCLSU. It
includes the development, deployment, and acquisition of
communication infrastructure.</p>
<p>This component installs and deploys communication
equipment and systems that interconnect the colleges and
units within the main campus and the satellite research and
laboratory schools and facilities. This infrastructure must
be able to support handling large and simultaneous transfer
of data between different users across the campus to
achieve convenience and efficiency in university
operations</p>
</div>
</div>
我也想在内容中放入图片,所以我使用div 预先谢谢你
答案 0 :(得分:1)
有一个小错误,请在:hover之前删除空间并完成操作,这是有效的代码段。
.project-item h3{
cursor: pointer;
}
#project-contentOne{
display: none;
}
.project-item:hover #project-contentOne{
display: block;
}
<div class="project-item">
<h3>University-wide High Spped Information Network</h3>
<div id="project-contentOne" class="p-content">
<p>University wide High-Speed Information Network is a
component of the 5-year project plan which is the eCLSU. It
includes the development, deployment, and acquisition of
communication infrastructure.</p>
<p>This component installs and deploys communication
equipment and systems that interconnect the colleges and
units within the main campus and the satellite research and
laboratory schools and facilities. This infrastructure must
be able to support handling large and simultaneous transfer
of data between different users across the campus to
achieve convenience and efficiency in university
operations</p>
</div>
</div>