前端面试宝典每日一题（12）一些常用css效果分享

骨灰级尤雨溪迷弟~

已于 2022-03-24 20:27:35 修改

阅读量841

点赞数 2

分类专栏：面试题文章标签：前端 css3

于 2022-03-24 20:27:20 首次发布

本文链接：https://blog.csdn.net/weixin_43742274/article/details/123720518

版权

面试题专栏收录该内容

21 篇文章 3 订阅

订阅专栏

🧑🏻‍写在前面的话：
这个系列文章可能开始，有人会觉得很low，我是打算从H5先开始整理，最后到常见的前端框架、以及一些前端常见的算法、leetcode的一些算法解析，感兴趣的小伙伴可以持续关注，每天分享一个前端知识点，希望大家一起进步。

这篇文章主要给大家分享两个我比较常用的css效果

1.单行、多行文本溢出隐藏

overflow: hidden;            // 溢出隐藏
text-overflow: ellipsis;      // 溢出用省略号显示
white-space: nowrap;         // 规定段落中的文本不进行换行

overflow: hidden;            // 溢出隐藏
text-overflow: ellipsis;     // 溢出用省略号显示
display:-webkit-box;         // 作为弹性伸缩盒子模型显示。-webkit-box-orient:vertical; // 设置伸缩盒子的子元素排列方式：从上到下垂直排列
-webkit-line-clamp:3;        // 显示的行数

2.css实现三角形

.caret {
			  width: 0;
			  height: 0;
			  border-top: 50px solid black;
			  border-right: 50px solid transparent;
			  border-left: 50px solid transparent;
			}