2014-02-26 7 views
2

맨 아래쪽 순서로 정렬되지 않은 목록을 렌더링하는 방법.정렬되지 않은 목록을 맨 아래쪽에있는 패션으로 렌더링하십시오.

첫 번째 요소가 지정된 위치에 표시되도록 목록에 사양을 넣고 싶습니다. 두 번째 항목은 첫 번째 항목의 맨 위에 표시됩니다. 세 번째 항목은 두 번째 항목의 상단에 표시됩니다 (예 : ). 목록은 첫 번째 요소가 지정된 위치에 고정 된 상태에서 맨 아래 (첫 번째 요소)에서 위쪽 (마지막 요소)으로 커야합니다. 목록은 웹킷에 의해 렌더링됩니다.

나는 이것을 달성하기 위해 아래 코드에서 무엇을 할 수 있는지 알아야합니다.

audio::-webkit-media-controls-closed-captions-track-list ul, 
video::-webkit-media-controls-closed-captions-track-list ul { 

display: list-item; 
list-style-type: disc; 
position: relative; 
right: 70px; 
bottom: 50px; 

}

어떤 도움을 주시면 감사하겠습니다.

감사합니다, 선일

답변

1

목록

aaa 
ggg 
ccc 
fff 

ul li 
{ 
    display: table-caption; 
} 

아래 CSS를 적용되며, 결과는

fff 
ccc 
ggg 
aaa 
2

당신이 목록 FR을 렌더링 할 수있는 경우 이 방법을 사용하여 아래에서 위로 옴.

ul { 
    display: flex; 
    flex-direction: column-reverse; 
} 

<ul> 
    <li>Item 1 </li> 
    <li>Item 2</li> 
</ul> 

다음은 실습 데모입니다. http://jsbin.com/petokazi/1/edit

+0

녹색 확인표를 사용하여이 대답을 수락 할 수 있습니다. 그래서 다른 사람들이 유익을 얻을 수 있습니다. –

관련 문제