HTML 테이블에서 앵커 태그 텍스트 가져오기를 자르는 방법
P粉547170972
P粉547170972 2023-08-16 12:24:24
0
1
488
<p>요소의 앵커 텍스트 내의 텍스트를 자르려고 합니다. 앵커 태그 스타일에 <code>overflow:hidden; text-overflow:ellipsis;</code>를 추가했지만 여전히 래핑됩니다.这里有一些可以复现의HTML:</p> <p><br /></p> <pre class="brush:html;toolbar:false;"> <html lang="ko" xmlns="http://www.w3.org/1999/xhtml"> <머리> 테스트 테스트 123 </머리> <본문> <div style="width: 100%; padding-top: 1px;"> <div 클래스="내용" 스타일="너비: 512px; flex-shrink: 0; 여백-왼쪽: 자동; 여백-오른쪽: 자동; 디스플레이: 블록;"> <div class="contents-body" 스타일="디스플레이: 블록; 너비: 512px;"> <테이블 스타일="너비:50%; 테두리 접기: 축소; 여백-왼쪽: 자동; 여백-오른쪽: 자동;"> <본문> <tr style="justify-content:center;align-items:center;gap:56px;color:#848585"> <번째 스타일="padding-top:8px;padding-bottom: 10px; 글꼴 스타일:normal;font-weight:500;line-height:16px;letter-spacing:0.1px;text-align:left;width :25%">열 A <번째 스타일="padding-top:8px;padding-bottom: 10px; 글꼴 스타일:normal;font-weight:500;line-height:16px;letter-spacing:0.1px;text-align:left;width :25%">B열 </tr> <tr> <rowspan="3" 스타일="폭:25%; 패딩-상단:8px; 패딩-하단:8px; 텍스트-정렬:왼쪽;폰트-크기:14px;폰트-스타일:일반;폰트-중량:500;라인 높이:16px; letter-spacing:0.1px;">항목 A</td> <td style="padding-top:8px; padding-bottom:8px; text-align:left;font-size:14px;font-style: Normal;font-weight:400;line-height: 16px;letter- 간격:0.1px;텍스트 장식-줄:밑줄;"> <a style="color:#E25323; 오버플로: 숨김; 텍스트 오버플로: 줄임표; 너비: 50px;" href="https://localhost">ABC123ABC-ABC123ABC`</a> </td> </tr> </tbody> </테이블> </div> </div> </div> </body> </html></pre> <p><br /></p> <p>앵커 태그 텍스트의 50픽셀 너비가 마음에 들지 않는 것 같습니다. 열 너비가 문제인 것 같습니다. </p>
P粉547170972
P粉547170972

모든 응답(1)
P粉099145710

줄바꿈을 원하지 않는 경우 white-space:nowrap;
를 추가할 수 있습니다. width,设置为 50px,而不是 50 px(공백 없음)을 설정하려는 경우
원한다면 width 生效,将你的 <a> 设置为块级元素,例如使用 display:inline-block

코드는 다음과 같습니다.

으아악
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트:공공복지 온라인 PHP 교육,PHP 학습자의 빠른 성장을 도와주세요!