Question

我们可以在CSS中创建没有Javascript的onclick弹出窗口吗？

Answer 1

不，你不能。您必须使用脚本为onlcick连接事件处理程序。

<a href="Somepage.html" target="_blank">Click me</a>

并且用户代理决定是否应在新窗口或选项卡中打开页面。

如果您需要一个具有自定义尺寸的新弹出窗口，则必须使用

window.open

如果没有脚本，你就无法使用它。

Answer 2

您不能，但您只能使用CSS创建工具提示。 It can do the trick：

您设置了正确的标记：

<div id="example">
    Result :
    <a href="#" class="tooltip">
        Article 1
        <span>Article 1's Title, Article 1's description.</span>
    </a>.
</div>

然后用悬停样式设置它：

#example { 
    float:left; 
    width:400px; 
    padding:15px; 
    background-color:#FFFFFF; 
}
a {
    background-color:#FFFFFF; 
    color:#000000; 
    text-decoration:underline;
}
a:hover {
    background-color:#ffffff; 
    text-decoration:none;
} /* background-color for IE6*/

 /* hiding the tooltip*/
a.tooltip span {
    display:none; /* if you have accessibility issues, you may choose other hiding tricks*/
    padding:2px 3px; 
    margin-left:10px; 
    width:150px;
}
 /* display on hover*/
    a.tooltip:hover span{
    display:inline; 
    position:absolute; 
    border:1px solid #cccccc;
    background:#ffffff; 
    color: #000;
}

Answer 3

理论上，您可以使用<button>，:focus以及一些令人讨厌的定位代码伪造它。

......但这会涉及极端丑陋的hackery。

CSS不是为向页面添加交互性而设计的。它是一种表达语言。

让JavaScript处理自定义交互，这就是它的用途（但始终是务实的 - progressively enhance）。

Answer 4

你可以使用css在点击弹出窗口上创建.. 使用css检查属性例如

input:checked {
    height: 50px;
    width: 50px;
}

使用它时，你必须有点棘手。使用此链接可获得更好的支撑

http://www.corelangs.com/css/box/fulloverlay.html#

我们可以在CSS中创建没有Javascript的onclick弹出窗口吗？

4 个答案: