Неизображающее решение для коннекторов чертежей в иерархической структуре

Question

Что я хочу сделать, это создать соединитель от второго tr ко всем tr ниже, кроме последнего.Вот мое текущее решение на основе изображений:

http://jsfiddle.net/DmcEB/13/

Однако я не хочу полагаться на изображения.Например, вместо этого используйте символы Unicode (unicode-search.net/unicode-namesearch.pl?term=bracket).

Среда: Rails, HTML / CSS, Prototype

Answer 1

используя :before и content:"", вы можете получить чистое решение CSS.При условии, что клиент может обрабатывать символы Юникода:

http://jsfiddle.net/ctrlfrk/DmcEB/19/

Вот список ящиков для рисования символов Юникода для справки: http://en.wikipedia.org/wiki/Box_drawing_characters

Answer 2

Вы можете добавить в каждую ячейку элемент рисования блока Unicode . Я скорее специалист по jQuery, но я думаю, что метод вставки или замены Prototype мог бы сделать это.

Единственная проблема, связанная с этим решением, заключается в том, что вашим пользователям нужно выбрать текст. Но для большинства браузеров вы можете обернуть символ с помощью span и использовать CSS, чтобы предотвратить выбор символа Юникода.

Примерно так: http://jsfiddle.net/DmcEB/18/

(последний элемент нуждается в исправлении)