728x90
반응형

overflow 3

CSS overflow-x : visible; 및 overflow-y : hidden; 스크롤바 문제 발생

질문 : CSS overflow-x : 보이는; 및 overflow-y : 숨김; 스크롤바 문제 발생 스타일과 마크 업이 있다고 가정합니다. ul { white-space: nowrap; overflow-x: visible; overflow-y: hidden; /* added width so it would work in the snippet */ width: 100px; } li { display: inline-block; } 1 2 3 4 5 6 7 8 9 1 2 3 4 5 6 7 8 9 1 2 3 4 5 6 7 8 9 이것을 볼 때. 은 오버플로 x / y에 대해 보이는 값과 숨겨진 값을 지정 했음에도 맨 아래에 스크롤 막대가 있습니다. (Chrome 11 및 오페라에서 관찰 (?)) 나는 w3c ..

table 셀의 CSS 텍스트가 길면 줄임표로 생략하는 방법

질문 : 표 셀의 CSS 텍스트 오버플로? text-overflow 로를 사용하여 텍스트가 너무 길어서 한 줄에 맞지 않는 경우 여러 줄로 감싸는 대신 줄임표로 잘립니다. 이것이 가능한가? 나는 이것을 시도했다 : td { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } 그러나 white-space: nowrap 은 텍스트 (및 해당 셀)가 지속적으로 오른쪽으로 확장되어 테이블의 전체 너비가 컨테이너 너비를 넘어서게하는 것처럼 보입니다. 그러나 텍스트가 없으면 텍스트가 셀의 가장자리에 닿을 때 여러 줄로 계속 줄 바꿈됩니다. 답변 테이블 셀을 오버플로 할 때 줄임표가있는 텍스트를 자르려면 오버플로가 작동하도록 td max-width C..

CSS를 사용하여 텍스트 길이를 n 줄로 제한

질문 : CSS를 사용하여 텍스트 길이를 n 줄로 제한 CSS를 사용하여 텍스트 길이를 "n"줄로 제한 할 수 있습니까 (또는 세로로 오버플로되면 잘라 내기). text-overflow: ellipsis; 한 줄 텍스트에만 작동합니다. 원본 텍스트 : 농구 마우스는 부동산을 느끼고 내일 일부 아이들은 게임과 칠리는 트럭으로 졸업했습니다. CNN은 이제 냄비를 투자합니다! 하지만 그것은! 얼마나 못생긴 집 마우스 개발자! Dapibus sed fermentum, magna sagittis, lorem velit 원하는 출력 (2 줄) : 농구 마우스는 부동산을 느끼고 내일 일부 아이들은 게임과 칠리는 트럭으로 졸업했습니다. 답변 비공식 라인 클램프 구문을 사용하는 방법이 있으며 Firefox 68부터 모든..

728x90
반응형