使用CSS折叠的文本 [英] Collapsed text using CSS
问题描述
我试图使用以下构造折叠我博客上文本的很长一部分
：
< style>
div.expand {display：none; }
div.expand：悬停（显示：内联;}
div.expand em {display：inline;}
< / style> ;
< p> Blablabla等lorem ipsum yadayada< / p>
< div class =''expand''>
< em>展开！< / em>
折叠文本的长列表
折叠文本的长列表
long折叠文本列表
折叠文本的长列表
折叠文本的长列表
折叠文本的长列表
[...]
< / div>
使用< emtags我希望只展示
默认。但它不是。所有内部的< divis隐藏（我在Linux上使用FF
1.5.0.8）我自己。此外，这不会起作用IE6，不确定
大约7.但由于我不太关心IE的兼容性，我可以用它来生活
（或者使用黑客提供替代方案） 。
我该怎么办？如果可能的话，使用CSS会接近这个吗？
理想情况下，除了
JavaScript之外，还有一个适合所有人（浏览器）的解决方案吗？ />
TIA！
Sh。
I have tried to collapse a long part of a text on my weblog
using the following construct:
<style>
div.expand { display : none; }
div.expand:hover (display : inline; }
div.expand em {display : inline; }
</style>
<p>Blablabla etc lorem ipsum yadayada</p>
<div class=''expand''>
<em>expand!</em>
long list of collapsed text
long list of collapsed text
long list of collapsed text
long list of collapsed text
long list of collapsed text
long list of collapsed text
[...]
</div>
Using the <emtags I hoped to make only the expand! text visible by
default. But it isn''t. Everything inside the <divis hidden (I use FF
1.5.0.8 on Linux) myself. Besides, this won''t work on IE6, not sure
about 7. But since I don''t care much for IE compatibility, I can live
with that (or provide an alternative using a hack).
How should I have approached this, if at all possible using CSS?
Ideally, is there a one-size-fits-all (browsers) solution, other than
JavaScript?
TIA!
Sh.
推荐答案
Schraalhans Keukenmeester< bi ** *****@invalid.spamwrote：
Schraalhans Keukenmeester <bi*******@invalid.spamwrote:
div.expand {display：none; }
div.expand：hover（display：inline;}
div.expand em {display：inline;}
div.expand { display : none; }
div.expand:hover (display : inline; }
div.expand em {display : inline; }
你如何建议键盘用户应该访问内容，或者说b $ b用户说话浏览器？
-
Spartanicus
And how do you propose that keyboard users should access the content, or
users of speaking browsers?
--
Spartanicus
Spartanicus写道：
Spartanicus wrote:
Schraalhans Keukenmeester< bi ******* @ invalid.spamwrote：
Schraalhans Keukenmeester <bi*******@invalid.spamwrote:
> div.expand {display：none;}
div.expand：hover（display：inline;}
div.expand em {display：inline;}
> div.expand { display : none; }
div.expand:hover (display : inline; }
div.expand em {display : inline; }
你如何建议键盘用户应该访问内容，或者
用户说话的浏览器？
And how do you propose that keyboard users should access the content, or
users of speaking browsers?
不知道。'普通'的新人怎么样？那些
的负载只显示完整项目的摘录，并提供链接或
折叠片段。
C如果想到这一点，视障人士单独的样式表
绝不会减少这种崩溃/扩展脚本的可用性。
如果keyb用户是问题（说实话，我不担心
所有三个）焦点伪类会实现同样的不是吗？
你对Spartanicus的工作解决方案有什么建议吗？
Sh。
No idea. How does ''the average'' newssite go about that? Loads of those
show only an excerpt of the full item and offer either a link or a
collapsed fragment.
Come to think of it, a separate style sheet for the visually impaired
would by no means diminish the usability of such a collapse/expand script.
If keyb users are the issue (to be honest, I don''t worry too much about
all three of them) the focus pseudoclass would achieve the same wouldn''t it?
Do you have a suggestion for a working solution too, Spartanicus?
Sh.
Schraalhans Keukenmeester写道：
Schraalhans Keukenmeester wrote:
>您如何建议键盘用户应该访问内容，或者说话浏览器的用户？
>And how do you propose that keyboard users should access the content, or
users of speaking browsers?
不知道。 普通新人如何做到这一点？这些
的负载仅显示完整项目的摘录，并提供链接或
折叠片段。
No idea. How does ''the average'' newssite go about that? Loads of those
show only an excerpt of the full item and offer either a link or a
collapsed fragment.
在可聚焦元素上使用键盘可触发事件（链接工作非常好
）。
By using keyboard triggerable events on focusable elements (links work very
well).
如果keyb用户是问题（说实话，我不要太担心
所有这三个）
If keyb users are the issue (to be honest, I don''t worry too much about
all three of them)
有很多键盘用户。放弃使用鼠标可以为RSI创造
奇迹（正如我在几个夏天前发现的那样）（并且还有很多
其他理由不使用指针设备）。
There are a great many keyboard users. Giving up use of a mouse can do
wonders for RSI (as I discovered a few summers ago) (and there are plenty
of other reasons to not use a pointing device).
焦点伪类会实现相同的不会是b $ b吗？
the focus pseudoclass would achieve the same wouldn''t
it?
不，因为你不能把重点放在div上。
-
David Dorward< http://blog.dorward.me.uk/<tp：//dorward.me.uk/>
Home是〜/ .bashrc所在的位置
No, since you can''t give the focus to a div.
--
David Dorward <http://blog.dorward.me.uk/ <http://dorward.me.uk/>
Home is where the ~/.bashrc is
这篇关于使用CSS折叠的文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
