分层结构中绘制连接器的非图像解决方案
我想要做的是创建一个从第二个 tr 到下面除最后一个 tr 之外的所有 tr 的连接器。这是我当前基于图像的解决方案：
但是，我不想依赖图像。例如，改用 Unicode 字符 (unicode-search.net/unicode-namesearch.pl?term=bracket)。
环境：Rails、HTML/CSS、原型
What I want to do is create a connector from the second tr to all the tr's below except for the last one. Here's my current image-based solution:
However, I don't want to rely on images. For example, using Unicode characters (unicode-search.net/unicode-namesearch.pl?term=bracket) instead.
Environment: Rails, HTML/CSS, Prototype
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
您可以在每个单元格前面加上 unicode 框绘图元素。我更喜欢 jQuery，但我认为 Prototype 的插入或替换方法可以做到这一点。
此解决方案的唯一问题是您的用户是否需要选择文本。但对于大多数浏览器，您可以用 span 包裹字符并使用 CSS 来防止选择 unicode 字符。
像这样的东西：
http://jsfiddle.net/DmcEB/18/
（最后一个元素需要一些修复）
You could prepend each cell with a unicode box drawing element. I'm more of a jQuery person, but I think Prototype's insert or replace method could do this.
The only problem with this solution would be if your users need to select the text. But for most browsers, you can wrap the character with a span and use CSS to prevent selection of the unicode char.
Something like this:
http://jsfiddle.net/DmcEB/18/
(Last element needs some fixing)
使用
:before和content:""你可以获得纯 CSS 解决方案。前提是客户端可以处理 unicode 字符：http://jsfiddle.net/ctrlfrk/DmcEB/19/< /a>
以下是方框图 unicode 字符列表，供参考：
http://en.wikipedia.org/wiki/Box_drawing_characters
using
:beforeandcontent:""you can get a pure CSS solution. Provided the client can handle the unicode characters:http://jsfiddle.net/ctrlfrk/DmcEB/19/
Here is a list of the box drawing unicode characters for reference:
http://en.wikipedia.org/wiki/Box_drawing_characters