2
감사 먼저 당신이 IBM 트랙 포인트를 사용하여 그려하지만 불행하게도 내가하지 마우스의 소지 지금, 주요 성분은해야하고 
CSS 및 HTML을 사용하여 가로 트리보기를 만드는 방법은 무엇입니까? 관심을
이동, 그래서 여기에 이미지 만 가치가 단어 생각 명확한. 일반적으로 트리보기가 수직이기 때문에 가로 트리라고 부릅니다. 한 줄에 하나의 디렉토리 만 볼 수 있으며 디렉토리 이름의 왼쪽에는이 디렉토리가 얼마나 깊이 중첩되어 있는지를 보여주는 수직선이됩니다. 나는 "디렉토리"를 서로 옆에 나열하려고 노력하고있다.
IF 및 ENDIF가있는 알고리즘 다이어그램에서 생각하면 항상 정확히 2 개의 출력 또는 입력이 있습니다.
이제는 기본 HTML 요소와 CSS로 이것을 만들려고 노력하고 있습니다. 처음에는 케이크 조각이 될 것이라고 생각했지만 그렇지 않았습니다. 나는 오후 내내 운이 없었습니다. JS에 의해 동적으로 생성되므로 테이블을 피하려고합니다. IF 수에 제한이 없지만 정확히 동일한 금액의 ENDIF가 있습니다. 다른 기본 셀이 여러 개있을 것입니다. 여기
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>IFs and ENDIFs</title>
<style>
ul, li, div{
margin: 0px;
padding: 0px;
border: 0px;
}
ul.left{
border: 1px solid red;
margin: 2px;
padding: 2px;
list-style-type:none;
width: 150px;
float:left;
}
ul.right{
border: 1px solid green;
margin: 2px;
padding: 2px;
list-style-type:none;
width: 150px;
float:left;
}
}
li.parent{
border: 1px solid blue;
background-color:#CC9;
margin: 2px;
padding: 2px;
min-width: 350px;
display:block;
overflow-style:marquee-block;
}
</style>
</head>
<body>
<div id="root">
<ul>
<li class="parent">
<div class="label">1</div>
<ul class="left">
<li>
<div class="label">1.L1</div>
</li>
<li>
<div class="label">1.L2</div>
</li>
<li class="parent">
<div class="label">1.L3</div>
<ul class="left">
<li>
<div class="label">1.L3.L1</div>
</li>
</ul>
<ul class="right">
<li>
<div class="label">1.L3.R1</div>
</li>
<li>
<div class="label">1.L3.R2</div>
</li>
</ul>
</li>
</ul>
<ul class="right">
<li>
<div class="label">1.R1</div>
</li>
<li>
<div class="label">1.R2</div>
</li>
<li class="parent">
<div class="label">1.R3</div>
<ul class="left">
<li>
<div class="label">1.R3.L1</div>
</li>
<li>
<div class="label">1.R3.L2</div>
</li>
<li>
<div class="label">1.R3.L3</div>
</li>
<li>
<div class="label">1.R3.L4</div>
</li>
</ul>
<ul class="right">
<li>
<div class="label">1.R3.R1</div>
</li>
<li>
<div class="label">1.R3.R2</div>
</li>
</ul>
</li>
</ul>
</li>
<li>
<div class="label">2</div>
</li>
<li>
<div class="label">3</div>
</li>
</ul>
</div>
</body>
</html>
가 :(지금까지처럼 희망 결과 근처 (아무것도 보지 않는다 무엇인가 : 전체 구조는 하나 개의 셀에서 시작하여 하나의 셀로 끝나는 여기
은 비슷한 사진을 생성해야 HTML입니다 왜냐하면 누군가가 올바른 방향으로 나를 가리킬 수 있다면, 나는 정말로 감사 할 것입니다. 
다른 사람을 고용 해보십시오. 너를 위해서이 일을 한 사람이 너의 것 같아. 정확히 무엇이 도움이 필요합니까? 어느 부분을 고민하고 있습니까? 자바 스크립트 로직? 스타일링? – gunwin
나쁘다. 아이들이있을 경우를 대비해 서로 옆에있는 요소를 떠 다니는 데 어려움을 겪고있다. 바닥에있는 나의 예에서와 같이, 나는 부모님 "1"의 자녀들을 "1.L"과 "1.R"을 서로 가깝게 얻을 수 있었지만, 나는 더 깊은 사람들과 운이 없었습니다. 하지만 고마워, 누군가를 고용하라고 말했어. 나는 무언가를하려고 노력하고 있습니다. 혼자 힘으로 돈을 벌지 않고, 실수를 저지르는 곳을 찾아 내고 싶습니다. 14 시간 동안 내 노트북을 쳐다 보면서 (처음 12 일은 뭔가 효과가 있었다 :) :) 곧바로 나는 기본적인 것들을 간과 할 수있다. 어쨌든,이 사이트는 서로 돕는 것을 기반으로하지 않습니까? – nana
나무가 아닙니다. 순환 그래프입니다. –