이 글에서는 최근 인기를 끌고 있는 WeChat 미니 프로그램의 CSS 활용 기술을 소개합니다. 도움이 필요한 학생들은 이 글을 참고하세요
WeChat 미니 프로그램 CSS 활용 기술
1: 순수 CSS로 삼각형을 만드는 원리 위쪽, 왼쪽, 오른쪽 숨기기(색상을 투명하게 설정)
.demo {
width:0;
height:0;
border-width:20px;
border-style:solid;
border-color:transparenttransparentredtransparent;
}로그인 후 복사 |
2: 최대 높이 설정... 슬라이드 가능
max-height:550rpx; overflow-y:scroll; 로그인 후 복사 |
3: text-overflow 속성은 텍스트가 오버플로될 때 발생하는 상황을 지정합니다. 포함 요소
clip: 텍스트 자르기 ellipsis: 줄임표를 사용하여 잘린 텍스트를 나타냅니다. string: 주어진 문자열을 사용하여 잘린 텍스트를 나타냅니다. 핵심은 3개입니다. 동시 사용: text-overflow:ellipsis;white-space:nowrap;overflow:hidden; |
4:overflow: Hidden 줄 바꿈을 강제로 하지 않을 때, Overflow:hidden을 사용하여 줄 바꿈을 초과하는 부분을 숨깁니다. 인터페이스
5: margin-bottom이 유효하지 않습니다
margin-bottom은 요소가 아래쪽으로 이동하는 것을 허용하지 않습니다. 위쪽 여백 역할을 합니다. 요소를 아래로 "밀어냅니다". 아이콘을 하단에서 30px로 설정하려면 ul에 position:absolute,bottom:30px를 설정하면 됩니다. (같은 효과를 얻기 위해 이 문장을 추가한 것은 아닙니다.) 또한 상위 요소 position:relative ㅋㅋㅋ |
자동 줄 바꿈 ㅋㅋㅋ 위 내용은 WeChat 미니 프로그램의 CSS 사용 기술 요약의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!p{
word-wrap: break-word;
word-break:normal;
}로그인 후 복사
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
