HTML/자바 스크립트 목록의 가장 왼쪽에있는 항목과 맨 오른쪽에있는 항목을 정렬하는 방법은 무엇입니까?

Question

내가 원하는 방식으로 항목 목록을 형식화 할 수 없도록 노력하고 있습니다.

이드는 맨 왼쪽에있는 항목과 맨 오른쪽에있는 항목을 좋아합니다.

다음은 의미를 설명하는 링크입니다.

list arrangement

어떻게 이렇게 가겠어요? 나는 테이블이 아마도 가장 쉬울 것이라고 들었지만 나는 또한 테이블에서 벗어나려고 노력했다.

Answer 1

두 개의 왼쪽 오른쪽에있는 데이터와 오른쪽에있는 데이터에 대해 하나씩 두 개의 <div>을 만드는 것이 좋습니다. 그런 다음 CSS 규칙으로 text-align:left 및 text-align:right을 각각 사용하십시오.

Answer 2

나는 실제로 테이블을 추천 할 것이고, 이것은 데이터 표 형식으로 데이터입니다. 표와 같은 단어 표는 테이블 형식의 데이터를 의미합니다. 여전히 목록을 쓰고 싶다면 2 개의 목록을 작성하고 tableA float : left 및 tableB float : right를 사용하는 것이 좋습니다.

확인이 바이올린 아웃 :

https://jsfiddle.net/selda_uxunicorn/assektkm/

CSS :

ul { 
    list-style: none; 
    padding: 0px; 
} 

.tableA { 
    float: left; 
} 

.tableB{ 
    float: right; 
    text-align: right; 
} 

HTML :

<ul class="tableA"> 
<li>this item</li> 
<li>this other item</li> 
</ul> 

<ul class="tableB"> 
<li>item</li> 
<li>another item</li> 
</ul>