Summary of css usage tips for WeChat applets

This article mainly introduces the relevant information about the tips for using small program css. For more information, see the tips for using small program css.

1: Create a triangle with pure CSS to hide the top, left, and right sides (set the color to transparent)

.demo { width: 0; height: 0; border-width: 20px; border-style: solid; border-color: transparent transparent red transparent; }

2: You can slide after setting the maximum height ..

max-height: 550rpx; overflow-y: scroll;

3: text-overflow what happens when the attribute specifies that text overflow contains elements

Clip: Trim text ellipsis: Use ellipsis to represent the trimmed text string: use a given string to represent the trimmed text. The key is three keys: text-overflow: ellipsis; white-space: nowrap; overflow: hidden;

4: overflow: hidden when force does not wrap, use overflow: hidden to hide parts beyond the interface

5: margin-bottom is invalid.

Margin-bottom is the bottom margin, which does not allow elements to move to the bottom. margin-top is used as the top margin to push the element down. If you want the icon to be 30 px away from the bottom, you can set position: absolute, bottom: 30px on ul (I didn't add the same effect for this sentence) and the parent element position: relative

6: force do not wrap

white-space:nowrap;

Automatic line feed

p{ word-wrap: break-word; word-break: normal; }

Force an English word to break a line

p{ word-break:break-all; }

Thank you for reading this article. I hope it will help you. thank you for your support for this site!

For more tips on small program css usage, please pay attention to the PHP Chinese website!