仅使用内联CSS隐藏/显示CSS
仅使用内联CSS隐藏/显示CSS
提问于 2018-07-17 04:41:34
特定的web编辑器只允许内联css，而不允许javascript。
我想做一个最小的显示/隐藏部分：
<div>
<p id="question"><a href="#answer">What do you call a fish with no eyes</a></p>
<p id="answer" style="visibility:hidden">Fsssssssh</p>
</div>有什么解决方案吗？-也就是兼容。
回答 1
Stack Overflow用户
回答已采纳
发布于 2018-07-17 04:58:28
简而言之，no。
虽然完全可以在没有任何JavaScript的情况下实现这样一个系统(用于多个问题和答案)，但不可能实现纯粹的内联。这是因为你不能以内联的伪元素为目标。
即使在你当前的HTML结构中，这仍然是不可能的，因为在CSS中没有子选择器(尽管已经起草了一个伪选择器)。
除此之外，还值得注意的是，内联CSS的高于样式表；除非使用!important声明，否则样式表规则不能覆盖内联CSS。
假设您正在更改您的超文本标记语言，这可以通过组合使用伪选择器、+*和!important声明来实现，如下所示：
#question:focus + #answer {
visibility: visible !important;
}<div>
<a id="question" href="#">What do you call a fish with no eyes</a>
<p id="answer" style="visibility:hidden">Fsssssssh</p>
</div>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51369815
复制相关文章
相似问题