문제

내 예에서는 예를 들어 각 행이 사용자 인 테이블이 있습니다. 열에는 이름, 주소, 이메일 주소 등이 포함될 수 있습니다. 이제 고양이 이름 (가상의 예)에 열을 추가해야합니다. 대부분의 사람들은 고양이가없고 어떤 사람들은 1-2 마리의 고양이를 가질 것이지만 테이블에 매우 긴 줄을 만드는 고양이 20 개가있는 사람이있을 것입니다. 이것은 나에게 프레젠테이션 및 고양이 이름을 필터링/검색하는 데 문제가 있습니다. 이러한 유형의 데이터를 표시하는 좋은 솔루션이 있습니까?

도움이 되었습니까?

해결책

필드의 처음 50 개 (또는 무엇이든) 문자를 정상으로 표시 한 다음 나머지는 CSS를 통해 숨겨져있는 가시성을 설정 한 블록에 넣습니다. 사용자가 가시성을 전환하여 전체 값을 볼 수 있도록 링크 / 버튼 / 아이콘을 포함시킵니다.

다른 팁

몇 가지 옵션 :

  1. 셀의 최대 너비를 설정하고 데이터가 래핑하도록 허용합니다.
  2. 래퍼 태그 (예 : div) 내부에 내용을 놓고 고정 너비/높이 및 오버플로 스타일로 DIV를 설정하십시오. 특히 긴 단어가 셀의 너비를 강제하지 않도록 숨겨져 있습니다.
  3. 서버 측에서 출력 텍스트를 잘라냅니다

케이스 #2 및 #3의 경우 TD 태그의 제목 속성을 설정하지 않도록 설정하지 않습니다. 이것은 셀 위에 호버링 할 때 툴팁으로 나타납니다.

나는 다른 CSS 기반 솔루션을 언급하지만 지금은 매우 드물게 지원되므로 언급 할 가치가 없습니다.

당신은 그렇게하는 것과 같은 일을 시도하고 싶을 수도 있습니다. 즉, 누군가가 담당자의 특정 지점에 도달하면 숫자를 접미사하고이를 획득합니다. 전. 10,236 대신 10k.

그렇게하면 숫자가 손을 떼지 않습니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top