CSS 常用 样式合集（适用uniapp） 收藏免丢失

Posted 2022-10-05 哈尔滨洛弘科技有限公司

线性渐变色

background-image: linear-gradient(yellow,red);

文字内容不溢出，全部显示

word-break: break-all;

设置DIV(VIEW)阴影

box-shadow: 1px 1px 5px rgb(230 230 230);

设置文字阴影

text-shadow:2px 3px 1px #FFF;
color: #000;

文字一行显示，超出隐藏

  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap; 

多行文字显示，超出隐藏

overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;

伪元素使用范例

.test::after
	content:' ';
	position:absolute;

超出隐藏

overflow:hide;
overflow-x:hide;
overflow-y:hide;

去除button自带边框

button::after
	border:none!important;

更改 input placeholder的样式

<input type="text" placeholder-class="placeholder-class">

.placeholder-class
	color:red